(Created page with "$(document).ready(function () { // add the div we want to use $('body').append('<div class="scroll position-fixed" style="width:70px; bottom: 100%;right:1em; transitio...") |
|||
Line 2: | Line 2: | ||
// add the div we want to use | // add the div we want to use | ||
$('body').append('<div class="scroll position-fixed" style="width:70px; bottom: 100%;right:1em; transition: all .3s ease-in-out">' + | $('body').append('<div class="scroll position-fixed" style="width:70px; bottom: 100%;right:1em; transition: all .3s ease-in-out">' + | ||
− | '<img src=" | + | '<img src="https://static.igem.org/mediawiki/2019/5/57/T--USTC-Software--scroll.png"/>' + |
'<div class="position-relative backHead" style="width: 70px; height: 110px; top: -110px; cursor: pointer;"></div>' + | '<div class="position-relative backHead" style="width: 70px; height: 110px; top: -110px; cursor: pointer;"></div>' + | ||
'</div>'); | '</div>'); |
Revision as of 11:14, 3 October 2019
$(document).ready(function () {
// add the div we want to use$('body').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%"); });
});