Fix Swiper plugin embedded IFRAME cannot slide problem

The IFRAME is another Web page, so Swiper detects no internal page events.

Method One: Directly set the style pointer-events:none; But all events inside the IFRAME will not be clickable including a link

Method two: Self-write internal page event detection, and then change the Swiper, this must be in the same homologous strategy JS can be carried out. Directly on the code ...

varSelf = This; varIsmove,pagex,poor,movearr; variframe = document.queryselector (' #myiframe '); varWrap = $ (' #shebao '). Closest ('. Swiper-wrapper ')); varnum; Iframe.onload=function(){                varDoc =iframe.contentWindow.document; Self.height= $ (' #shebao '). Parent (). height (); Doc.addeventlistener ("Touchstart",function(e) {Ismove=true; Movearr= []; PageX= E.targettouches[0].pagex;                    Movearr.unshift (PageX); //transform values obtained, matrix (1, 0, 0, 1, -1280, 0)num = wrap.css (' transform '). Split (', ') [4];                }); Doc.addeventlistener ("Touchmove",function(e) {if(!ismove)return;                                        E.preventdefault (); /*probably the cause of the IFRAME, the touch event will produce two different data when moving, resulting in jitter when sliding. This adds an array of Movearr to compare the current value with the historical value, removing the excess data*/                    //when you go to the left,                    if(PageX > E.targettouches[0].pagex) {//the historical value should be greater than the current value, otherwise return                        if(Movearr[0] < e.targettouches[0].pagex) {return; }                    }                    //when the right slide,                    if(PageX < E.targettouches[0].pagex) {//the historical value should be less than the current value, otherwise return                        if(Movearr[0] > E.targettouches[0].pagex) {return; }                    }                    //inserting data into the head of an arrayMovearr.unshift (e.targettouches[0].pagex); Poor= Pagex-e.targettouches[0].pagex; Wrap.css (' Transform ', ' Translate3d (' + (Num-poor) + ' px,0px,0px ')); }) Doc.addeventlistener ("Touchend",function(e) {Ismove=false; Poor= Pagex-e.changedtouches[0].pagex; //previous page next action when moving beyond the set value for Swiper                    if(Math.Abs (Poor) >50){                        if(Poor < 0) {Window.pages.slidePrev (); }Else{window.pages.slideNext (); }                    }Else{                        //Restore Current LocationWrap.css (' transform ', ' Translate3d (' +num+ ' px,0px,0px) ');            }                                    }); }        }

Fix Swiper plugin embedded IFRAME cannot slide problem