@@ -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