Skip to content

Commit 2a986b5

Browse files
committed
Fix iframe overlay and z-index
1 parent d7facbc commit 2a986b5

1 file changed

Lines changed: 28 additions & 6 deletions

File tree

code.js

Lines changed: 28 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -451,6 +451,7 @@ Code.loadDemoArea = function () {
451451
var resizeRightBar = document.querySelector('#demo-area .resize-bar-right');
452452
var resizeBottomBar = document.querySelector('#demo-area .resize-bar-bottom');
453453
var resizeTopBar = document.querySelector('#demo-area .resize-bar-top');
454+
var simulatorArea = document.getElementById('simulator-area');
454455

455456
area.className = area.className.replace("show", "");
456457

@@ -492,6 +493,8 @@ Code.loadDemoArea = function () {
492493

493494
area.style.opacity = '0.4';
494495
frame.style.pointerEvents = 'none';
496+
simulatorArea.style.zIndex = '';
497+
area.style.zIndex = '9999';
495498

496499
cover.classList.add('demo-cover');
497500
document.body.appendChild(cover);
@@ -516,15 +519,17 @@ Code.loadDemoArea = function () {
516519

517520
});
518521

519-
resizeLeftBar && resizeLeftBar.addEventListener('mousedown', function (e) {
522+
resizeLeftBar.addEventListener('mousedown', function (e) {
520523

521524
var cover = document.createElement('div');
522525
var frame = document.getElementById('demo-frame');
523526
var ox = e.pageX;
524527
var dw = area.offsetWidth;
525-
528+
526529
area.style.opacity = '0.4';
527530
frame.style.pointerEvents = 'none';
531+
simulatorArea.style.zIndex = '';
532+
area.style.zIndex = '9999';
528533
area.className += " resize";
529534

530535
cover.classList.add('demo-cover');
@@ -551,17 +556,19 @@ Code.loadDemoArea = function () {
551556

552557
});
553558

554-
resizeRightBar && resizeRightBar.addEventListener('mousedown', function (e) {
559+
resizeRightBar.addEventListener('mousedown', function (e) {
555560

556561
var cover = document.createElement('div');
557562
var frame = document.getElementById('demo-frame');
558563

559564
var frameWidth = area.offsetWidth;
560565
var mouseX = e.pageX;
561566
var positionRight = document.body.offsetWidth - area.offsetLeft - frameWidth;
562-
567+
563568
area.style.opacity = '0.4';
564569
frame.style.pointerEvents = 'none';
570+
simulatorArea.style.zIndex = '';
571+
area.style.zIndex = '9999';
565572
area.className += " resize";
566573

567574
cover.classList.add('demo-cover');
@@ -604,7 +611,7 @@ Code.loadDemoArea = function () {
604611

605612
});
606613

607-
resizeBottomBar && resizeBottomBar.addEventListener('mousedown', function (e) {
614+
resizeBottomBar.addEventListener('mousedown', function (e) {
608615

609616
var cover = document.createElement('div');
610617
var frame = document.getElementById('demo-frame');
@@ -613,6 +620,8 @@ Code.loadDemoArea = function () {
613620

614621
area.style.opacity = '0.4';
615622
frame.style.pointerEvents = 'none';
623+
simulatorArea.style.zIndex = '';
624+
area.style.zIndex = '9999';
616625
area.className += " resize";
617626

618627
cover.classList.add('demo-cover');
@@ -645,7 +654,7 @@ Code.loadDemoArea = function () {
645654

646655
});
647656

648-
resizeBottomBar && resizeTopBar.addEventListener('mousedown', function (e) {
657+
resizeTopBar.addEventListener('mousedown', function (e) {
649658

650659
var cover = document.createElement('div');
651660
var frame = document.getElementById('demo-frame');
@@ -656,6 +665,8 @@ Code.loadDemoArea = function () {
656665

657666
area.style.opacity = '0.4';
658667
frame.style.pointerEvents = 'none';
668+
simulatorArea.style.zIndex = '';
669+
area.style.zIndex = '9999';
659670
area.className += " resize";
660671

661672
cover.classList.add('demo-cover');
@@ -808,6 +819,7 @@ Code.loadSimulator = function () {
808819
var resizeRightBar = document.querySelector('#simulator-area .resize-bar-right');
809820
var resizeBottomBar = document.querySelector('#simulator-area .resize-bar-bottom');
810821
var resizeTopBar = document.querySelector('#simulator-area .resize-bar-top');
822+
var demoArea = document.getElementById('demo-area');
811823
var storage = {};
812824

813825
if (localStorage.simulator) {
@@ -883,6 +895,8 @@ Code.loadSimulator = function () {
883895

884896
area.style.opacity = '0.4';
885897
frame.style.pointerEvents = 'none';
898+
demoArea.style.zIndex = '';
899+
area.style.zIndex = '9999';
886900

887901
cover.classList.add('simulator-cover');
888902
document.body.appendChild(cover);
@@ -919,6 +933,8 @@ Code.loadSimulator = function () {
919933

920934
area.style.opacity = '0.4';
921935
frame.style.pointerEvents = 'none';
936+
demoArea.style.zIndex = '';
937+
area.style.zIndex = '9999';
922938
area.classList.add('resize');
923939

924940
cover.classList.add('simulator-cover');
@@ -959,6 +975,8 @@ Code.loadSimulator = function () {
959975

960976
area.style.opacity = '0.4';
961977
frame.style.pointerEvents = 'none';
978+
demoArea.style.zIndex = '';
979+
area.style.zIndex = '9999';
962980
area.classList.add('resize');
963981

964982
cover.classList.add('simulator-cover');
@@ -1012,6 +1030,8 @@ Code.loadSimulator = function () {
10121030

10131031
area.style.opacity = '0.4';
10141032
frame.style.pointerEvents = 'none';
1033+
demoArea.style.zIndex = '';
1034+
area.style.zIndex = '9999';
10151035
area.classList.add('resize');
10161036

10171037
cover.classList.add('simulator-cover');
@@ -1058,6 +1078,8 @@ Code.loadSimulator = function () {
10581078

10591079
area.style.opacity = '0.4';
10601080
frame.style.pointerEvents = 'none';
1081+
demoArea.style.zIndex = '';
1082+
area.style.zIndex = '9999';
10611083
area.classList.add('resize');
10621084

10631085
cover.classList.add('simulator-cover');

0 commit comments

Comments
 (0)