Line 1: | Line 1: | ||
$(document).ready(function () { | $(document).ready(function () { | ||
// add the div we want to use | // add the div we want to use | ||
+ | console.log("addScrollBar is ok"); | ||
$('#content').append('<div class="scroll position-fixed" style="width:70px; bottom: 100%;right:1em; transition: all .3s ease-in-out">' + | $('#content').append('<div class="scroll position-fixed" style="width:70px; bottom: 100%;right:1em; transition: all .3s ease-in-out">' + | ||
'<img src="https://static.igem.org/mediawiki/2019/5/57/T--USTC-Software--scroll.png"/>' + | '<img src="https://static.igem.org/mediawiki/2019/5/57/T--USTC-Software--scroll.png"/>' + |
Revision as of 11:45, 3 October 2019
$(document).ready(function () {
// add the div we want to use console.log("addScrollBar is ok");$('#content').append('
' +
');
'<img src=""/>' +'' + '
// basic operation let show = false; $(window).scroll(function () { let toTop = $(document).scrollTop(); if (toTop > 300 && !show){ $(".scroll").css("bottom", "5%"); console.log('gt 300px'); show = true; }else if(toTop <= 300 && show){ $(".scroll").css("bottom", "100%"); console.log('lt 300px'); show = false; } });
// make the img clickable $('.backHead').on('click', function () { $('body, html').animate({ scrollTop: 0, screenLeft: 0 }, 300); $(".scroll").css("bottom", "100%"); });
});