jQuery m custom scrollbar parallax -


i wanted add parallax effect (different scroll speed) jquery custom scroll bar plugin (mcustomscrollbar). i'm combining 2 examples of code:

  1. http://codepen.io/jtparrett/pen/bkdie - different scrolling speeds
  2. manos.malihu.gr/tuts/custom-scrollbar-plugin/full_page_demo.html - full page scroller

see - http://manos.malihu.gr/jquery-custom-content-scroller/ (plugin callbacks / functions)

i have managed make both examples work separately, not together, have end this:

j(window).load(function(){  j("body").mcustomscrollbar({ scrollbuttons:{ enable:true },  callbacks:{  onscrollstart:function(){ mycallback(this,"#onscrollstart") },  onscroll:function(){     var boxes = j('[data-scroll-speed]'),       jwindow = this.mcs.content;    var scrolltop = this.mcs.top;        boxes.each(function(){       var jthis = j(this),       scrollspeed = parseint(jthis.data('scroll-speed')),       val = - scrolltop / scrollspeed;       jthis.css('transform', 'translatey(' + val + 'px)');       });                  },          whilescrolling:function(){                      }, alwaystriggeroffsets:false  }  });  }); 

elements html is:

img src="http://www.somedomain.com.au/wp-content/uploads/2015/06/first-bg.png" alt="first-bg" width="800" height="582" class="aligncenter size-full wp-image-678 para" data-scroll-speed="7" /> 

/* note data-scroll-speed="7" - img element needs have different scroll speed */

any appreciated.

thank you!


Comments

Popular posts from this blog

Magento/PHP - Get phones on all members in a customer group -

php - .htaccess mod_rewrite for dynamic url which has domain names -

Website Login Issue developed in magento -