scrolltop | 易学教程

Internet Explore 8 won't change image src with .attr()

阅读更多关于 Internet Explore 8 won't change image src with .attr()

问题 I have set up a page which will flick through a sequence of images as the user scrolls with their mouse or trackpad. I'm using jQuery to measure the distance from the top of the page - scrollTop() - to then change the image source for a particular id in the DOM. This is working perfectly in Firefox, Chrome, Safari, Opera, IE9 and also on the iPad, iPhone, etc. HOWEVER, it doesn't work in IE8. This is the HTML: <div id="flipping-container"> <img id="flipping-id" class="flippingTarget" src=

Why does .animate to scrollTop jump to 0 before animating?

阅读更多关于 Why does .animate to scrollTop jump to 0 before animating?

问题 I am playing with Parallax scrolling like on that nike site. So I have been using scrollTop to determine the user's vertical position on the page and then I've been adjusting element's positions based on the changes to that value. Here I round the scrollTop value and log it. I'll show the log later. var distance = 60*(Math.round($(window).scrollTop()/60)); console.log(distance); Then, on click, I call this function which scrolls to the scrollTop value that I've passed it. function goTo(n){

Play through pinned elements in superscrollorama

阅读更多关于 Play through pinned elements in superscrollorama

问题 I am building a Parallax website using SuperScrollorama which have some animation frame by frame using jquery and css3... But after ending up doing so i am stuck in a problem, i am trying to navigate the pages using some scroll plugin... I have tried Basic jquery using scrollTop event, using Jquery ScrollTo and using Tween Lite ScrollTo plugin to navigate through pages but nothing seems to work... The issue i get after goggling it is if pages are pinned together as position:fixed; and pages

jquery animate scrolltop callback

阅读更多关于 jquery animate scrolltop callback

问题 I have the following jquery that scrolls the page to the top, then performs a callback function. The problem is that even if the page is already at the top, it still waits for the '1000' to elapse before performing the callback, which i dont want it to. $('html').animate({scrollTop:0}, 1000, 'swing', function(){ //do something }); 回答1: It doesn't wait It animates your document from top to the top... Funny but that's how it is. You have other alternatives. Either: check your page position

vue返回上一页面时不刷新

前景：在日常使用的时候，我们经常需要返回上一级页面的时候，不刷新页面，保持页面不变，这里就需要使用以下方法：思路：因为vue是单页面应用，进入其他页面时会销毁该页面，用keep-alive不让其刷新，具体实现为： (1).在App.vue中加入：这里是所有页面切换到地方，下面代码分别对不同的设置，采用不同的渲染方式。 < template > < div id = "app" > < ! -- < router - view / > -- > < ! -- 页面返回不刷新 -- > < keep - alive > < router - view v - if = "$route.meta.keepAlive" > < / router - view > < / keep - alive > < router - view v - if = "!$route.meta.keepAlive" > < / router - view > < / div > < / template > (2).index.js页面在需要设置不刷新的页面中，只需要添加 keepAlive: true就可以。 export default new Router ( { routes : [ { path : '/' , name : 'index' , component : index ,

$(window).scrollTop() is not working in safari

阅读更多关于 $(window).scrollTop() is not working in safari

问题 It works fine on firefox and chrome,but safari seem to have some issue.Here is the code. function founders() { var scrollPos = $(window).scrollTop(); if (scrollPos == 900) { $(function() { $(".first_fall").fadeIn(1000); $(".second_fall").fadeIn(2000); $(".third_fall").fadeIn(3000); }); }; } And this is how I have called it $(document).ready(function(e) { $(window).bind('scroll', function() { founders(); }); }); The very same function works well on safari and chrome on a different page.Here is

How to find scroll top value for div

阅读更多关于 How to find scroll top value for div

问题 I am working on responsive site. We need when a user see video section that's need to autoplay. If set scroll top for video tag is not working. But i set scrolltop to window it's working fine. <video id="test"> </video> <script> $(document).ready(function () { $(window).scroll(function () { var js=$('#test-28').scrollTop(); console.log(js); }); }); </script> Its always show 0 Anyone know how to slove this 回答1: You need use offest().top to get distance to reach video element. scrollTop will

jQuery scrolltop - not working after first use

阅读更多关于 jQuery scrolltop - not working after first use

问题 i am using jQuery scrolltop function on this menu: http://goethesternfriseure.de/index.php the issue is that the scroll function is only working at the first time. after a second click on a link, it scrolls to much to the bottom. $('.sectionlink').click(function(e){ var sectionelement = $(this).attr("rel"); var myoffset = $('#'+sectionelement).offset().top; $('html, body').animate({ scrollTop: myoffset }, 800); e.preventDefault(); }); does anyone know whats happening there? 回答1: your scroll

Subpixel scroll issue, can't set scrollTop properly on Chrome 69

阅读更多关于 Subpixel scroll issue, can't set scrollTop properly on Chrome 69

问题 I'm trying to set scrollTop property of some DOM element programmatically and I have weird behaviour that breaks my tests in some specific environment. I created minimal repro (the link) HTML <div id=viewport><div id=content></div></div> CSS #viewport { overflow-y: auto; height: 20px; } #content { height: 150px; } JS const viewport = document.getElementById("viewport"); viewport.scrollTop = 75; console.log(viewport.scrollTop); The result of the script is broken on Chrome 69.0.3497.100 running

Cross Browser issue with jQuery offset()top returning different values

阅读更多关于 Cross Browser issue with jQuery offset()top returning different values

问题 Essentially, what I'm trying to do, is apply a CSS class to an element in context to the scroll position of the document. Specifically, allowing my sidebar navigation to scroll to 20px below the top of the view port along with the rest of the content, at which point the element becomes of fixed position, thanks to the css class added, until the document is subsequently scrolled back up above that point, when the class is removed and the element again scrolls with the rest of the page content.