javascript - Trigger scroll to animate on Safari -


currently have gallery when clicked on correct menu appears animation. works fine on desktop, when used on iphone needto scroll items appear.

it works in desktops because trigger scroll when clicked on menu, don´t know why changes on safari iphone.

<div class="offset-top-60 inset-left-15 inset-right-15 inset-md-left-0 inset-md-right-0">           <!-- responsive-tabs-->           <div data-type="horizontal" class="responsive-tabs responsive-tabs-classic" >             <ul data-group="tabs-group-default" class="resp-tabs-list tabs-1 text-center tabs-group-default">               <li class="rtabs">propiedades</li>               <li class="rtabs">comunicaciĆ³n</li>               <li class="rtabs">cuotas</li>               <li class="rtabs">amenidades</li>               <li class="rtabs">eventos</li>               <li class="rtabs">documentos</li>               <li class="rtabs">staff</li>             </ul>             <div data-group="tabs-group-default" class="resp-tabs-container text-left tabs-group-default" id="toscroll">             <!--propiedades -->                 <div class="section-img-demonstration">                   <a><img width="700" height="400" alt="" class="img-responsive"></a>                     <a href="./img/landing/residentes2.jpg" data-lightbox="galeria1" data-animation="fadeinup" data-delay="0.03" data-duration="1" class="img-wrap animateitem"><img src="./img/landing/residentes2.jpg" width="700" height="400" alt="" class="img-responsive"></a>                     <a href="./img/landing/residentes.jpg" data-lightbox="galeria1" data-animation="fadeinup" data-delay="0.06" data-duration="1" class="img-wrap animateitem"><img src="./img/landing/residentes.jpg" width="700" height="400" alt="" class="img-responsive"></a>                     <a href="./img/landing/propiedades2.jpg" data-lightbox="galeria1" data-animation="fadeinup" data-delay="0.09" data-duration="1" class="img-wrap animateitem"><img src="./img/landing/propiedades2.jpg" width="700" height="400" alt="" class="img-responsive"></a>                     <a href="./img/landing/propiedades.jpg" data-lightbox="galeria1" data-animation="fadeinup" data-delay="0.12" data-duration="1" class="img-wrap animateitem"><img src="./img/landing/propiedades.jpg" width="700" height="400" alt="" class="img-responsive"></a>                   </div> 

now js

/*** viewport universal* @description add class in viewport*/   if (plugins.viewanimate.length && isdesktop) { var i,     sectionanimatecontet = $('.animate-content'),     sectionanimatecontetisanimate = false;  (i = 0; < plugins.viewanimate.length; i++) {   var $view = $(plugins.viewanimate[i]);    $document.on("scroll", $.proxy(function () {         var _this = $(this);         if (!_this.parents('.animate-content').length || sectionanimatecontetisanimate) {           if (isscrolledintoview(_this)) {             addanimation(_this, 'animate');           }         }        }, $view))     .trigger("scroll"); }   //custom animation on fixed section if (sectionanimatecontet.length) {   sectionanimatecontetisanimate = true;    $document.on("scroll", function () {     $window.scrolltop() + $window.height();     if ($window.scrolltop() + $window.height() / 2 - 100 >= sectionanimatecontet.offset().top) {       var animateitems = sectionanimatecontet.find('.animateitem');        (i = 0; < animateitems.length; i++) {         var item = $(animateitems[i]);         addanimation(item, 'active-animate');       }     }   }); }}/*** responsive tabs* @description enables responsive tabs plugin*/if (plugins.responsivetabs.length) { var = 0; (i = 0; < plugins.responsivetabs.length; i++) {   var $this = $(plugins.responsivetabs[i]);   $this.easyresponsivetabs({     type: $this.attr("data-type"),     tabidentify: $this.find(".resp-tabs-list").attr("data-group") || "tab"   }); }}/*** section animate* @description  enables animate section effect on scroll*/  if (plugins.sectionanimate.length) { if (isdesktop) {   requestanimationframe(animatesection); }  $(window).resize(function () {   var windowwidth = $(window).width();    if (isdesktop) {     //scrollbar     windowwidth += 17;      if (windowwidth <= 991) {       plugins.sectionanimate.removeclass('start');     } else {       if (!plugins.sectionanimate.hasclass('start')) {         plugins.sectionanimate.addclass('start');       }     }   } }).trigger('resize');}});/** activacion scroll de responsive tabs */ $(window).ready(function(){     $(".rtabs").click(function(){  $(".responsive-tabs").scroll();  }); }); 


Comments

Popular posts from this blog

ios - MKAnnotationView layer is not of expected type: MKLayer -

ZeroMQ on Windows, with Qt Creator -

unity3d - Unity SceneManager.LoadScene quits application -