PDA

View Full Version : scroll fading



Asalii
سه شنبه 24 تیر 1393, 18:56 عصر
سلام لطفا واسم یه کد css و jQuery بزارید که دکمه پرش به بالا داشته باشه و فقط وقتی صفحه اسکرول میشه پاین ظاهر شه ممنون

Freedon_23
چهارشنبه 25 تیر 1393, 11:32 صبح
سلام کد جی کوئری:
jQuery(document).ready(function() {
jQuery('a.scroll').css({'display': 'none', 'position': 'fixed', 'right': '30px', 'bottom': '10px'});
jQuery(document).scroll(function() {
var scrTop = document.body.scrollTop;
if (scrTop > 0) {
jQuery('a.scroll').fadeIn(300);
} else {
jQuery('a.scroll').fadeOut(300);
}
})
jQuery('a.scroll').click(function() {
jQuery('body').animate({scrollTop:0}, '500', 'swing');
})
});

کد html

<a class="scroll">scroll</a>

Freedon_23
چهارشنبه 25 تیر 1393, 12:17 عصر
اگر کد جی کوئری بالا کار نکرد این کد رو امتحان کنید:
jQuery('a.scroll').css({'display': 'none', 'position': 'fixed', 'right': '30px', 'bottom': '30px', 'color': '#fff'});
jQuery(document).scroll(function() {
var scrTop = jQuery(window).scrollTop();
if (scrTop > 0) {
jQuery('a.scroll').fadeIn(300);
} else {
jQuery('a.scroll').fadeOut(300);
}
})
jQuery('a.scroll').on('click', function() {
//jQuery('body').animate({scrollTop:0},500);
jQuery('html, body').animate({
scrollTop: jQuery("body").offset().top
}, 700);
})