Closed effectualmedia closed 10 years ago
Hello,
I have implemented jcarousel on http://demo.galligallisimsim.com/category/videos/ It's working perfectly on desktop.
Just scrolling is not working on Mobile portrait (320x480). Do anyone have solution of this problem?
My code is -
$(function() { /* $(".carousel").jCarouselLite({ btnNext: ".next", btnPrev: ".prev", vertical: true });*/ $(".slides").jCarouselLite({ btnNext: ".nexts", btnPrev: ".prevs"
});
$(".carousel").css('height', (93*3)+'px'); //$("#scroll").css('width', $("#scroll > li").width()+20); jQuery.noConflict();
$('.carousel').each(function(){ $('#scroll', this).css('float','left'); var flag=0; console.log(this); var cnt=0, pos=0; $('.round-over',this).each(function(){ if($(this).hasClass('round-over-selected')){ pos=cnt; } cnt++; }); $(this).mouseenter(function(e) { $(this).stop(); console.log(flag); flag=1; }).mouseleave(function(e) { $(this).stop(); console.log(flag); flag=0; }).mousemove(function(e) { Y = (e.pageY - $(this).offset().top); console.log(Y); if(flag){ flag=0; if(Y<($(this).height()/2)){ scrollTop = $(this).scrollTop(); $(this).stop().animate({ 'scrollTop': '0px' }, scrollTop_10,function(){ flag=1; }); } else if(Y>($(this).height()/2)){ scrollTop = $(this).scrollTop(); $(this).stop().animate({ 'scrollTop': $("#scroll",this).height() + 'px' }, ($("#scroll",this).height()-($(this).height()+scrollTop))_10,function(){ flag=1; }); } } }).animate({scrollTop:(pos*93)+'px'},100); }); //setTimeout(function(){ //$("#demo img[title]").tooltip(); //},200);
Hello,
I have implemented jcarousel on http://demo.galligallisimsim.com/category/videos/ It's working perfectly on desktop.
Just scrolling is not working on Mobile portrait (320x480). Do anyone have solution of this problem?
My code is -
$(function() { /* $(".carousel").jCarouselLite({ btnNext: ".next", btnPrev: ".prev", vertical: true });*/ $(".slides").jCarouselLite({ btnNext: ".nexts", btnPrev: ".prevs"
});
$(".carousel").css('height', (93*3)+'px'); //$("#scroll").css('width', $("#scroll > li").width()+20); jQuery.noConflict();
$('.carousel').each(function(){ $('#scroll', this).css('float','left'); var flag=0; console.log(this); var cnt=0, pos=0; $('.round-over',this).each(function(){ if($(this).hasClass('round-over-selected')){ pos=cnt; } cnt++; }); $(this).mouseenter(function(e) { $(this).stop(); console.log(flag); flag=1; }).mouseleave(function(e) { $(this).stop(); console.log(flag); flag=0; }).mousemove(function(e) { Y = (e.pageY - $(this).offset().top); console.log(Y); if(flag){ flag=0; if(Y<($(this).height()/2)){ scrollTop = $(this).scrollTop(); $(this).stop().animate({ 'scrollTop': '0px' }, scrollTop_10,function(){ flag=1; }); } else if(Y>($(this).height()/2)){ scrollTop = $(this).scrollTop(); $(this).stop().animate({ 'scrollTop': $("#scroll",this).height() + 'px' }, ($("#scroll",this).height()-($(this).height()+scrollTop))_10,function(){ flag=1; }); } }
}).animate({scrollTop:(pos*93)+'px'},100); }); //setTimeout(function(){ //$("#demo img[title]").tooltip(); //},200);