scrollto

Scroll to the center of viewport

£可爱£侵袭症+ 提交于 2019-12-03 05:21:39
问题 I would like to center a div by clicking it. So if I'm clicking a div I want it to scroll to the center of the browser viewport. I don't want to use anchor points like the guides and examples I've seen. How can I achieve this? 回答1: In some way you have to identify the clickable elements. I build an example, that uses the class -attribute for that. Step 1 This is the script, that does the work: $('html,body').animate({ scrollTop: $(this).offset().top - ( $(window).height() - $(this)

Bootstrap collapse - go to top of the open item?

旧巷老猫 提交于 2019-12-03 05:06:44
问题 I'm using the bootstrap collapse function, but when I open an element which has a lot of content, then open the next element, it jumps down and doesn't go to the top of the open element. I've tried using scrollto plugin as shown below but it doesn't work: JS: $(function(){ $('a.accordion-toggle').click(function(){ $.scrollTo( this, 500); }) }); HTML: <div class="accordion" id="accordion2"> <div class="accordion-group heading-left-11"> <h5 class="accordion-heading row"> <a class="accordion

jQuery: move window viewport to show freshly toggled element

前提是你 提交于 2019-12-02 20:52:38
I have a snippet of jQuery in doc ready which toggles a div containing a textarea : $('div#addnote-area').hide(); // hide the div $('a#addnote-link').click(function() { // click event listener on link $('div#addnote-area').toggle(); // toggle the hidden div }); The toggle works fine when clicking the link. The problem I'm having is that if div#addnote-area is below the browser's current viewport, it remains there when it's shown. I'd like the user's cursor to go to the textarea and for the whole textarea to be viewable in the window. Check out the scrollTo jQuery plugin . You can simply do

Bootstrap collapse - go to top of the open item?

六月ゝ 毕业季﹏ 提交于 2019-12-02 19:28:29
I'm using the bootstrap collapse function, but when I open an element which has a lot of content, then open the next element, it jumps down and doesn't go to the top of the open element. I've tried using scrollto plugin as shown below but it doesn't work: JS: $(function(){ $('a.accordion-toggle').click(function(){ $.scrollTo( this, 500); }) }); HTML: <div class="accordion" id="accordion2"> <div class="accordion-group heading-left-11"> <h5 class="accordion-heading row"> <a class="accordion-toggle span11" data-toggle="collapse" data-parent="#accordion2" href="#collapse1">Austria</a> <div class=

When form is validated, how to SCROLL to the first error instead of jumping?

﹥>﹥吖頭↗ 提交于 2019-12-02 14:17:11
I've seen many questions with variations on this theme, but I'm looking for the straightforward solution: HTML form, jQuery validation, multiple fields are required. When the form is submitted, validation jumps to the first error and highlights it. To increase usability, I want to scroll to that first error field. But it keeps blowing up the validation entirely or throwing scrollTo errors. I need to use the standard validation plugin (http://docs.jquery.com/Plugins/Validation) but any scroller would be fine, tho I had been trying with scrollTo (http://flesler.blogspot.com/2007/10

ScrollTop really jerky in Chrome

╄→гoц情女王★ 提交于 2019-12-02 12:18:22
问题 I'm using the scrollTop function to create a parallax scrolling website, binding the scrollTop function to different anchors throughout my website. The problem I'm having is that the scrolling becomes really choppy/jerky in Chrome, but somehow its fine in Firefox. My code is as follows: $('.recipes').click(function(){ $('html,body').animate({ scrollTop: $(".main1").offset().top }, 1500); }); $('.cooking').click(function(){ $('html,body').animate({ scrollTop: $(".main2").offset().top }, 1500);

Problem with scrollto offset javascript because of header

穿精又带淫゛_ 提交于 2019-12-02 04:35:25
问题 I need help with this scrollto code snippet. The problem is that I need to set an offset to account for my menu. Without the offset the header that I scroll to gets buried underneath the menu. See for yourselves here:https://julyfx.mystagingwebsite.com/stanford-mba-msx-essay-topic-analysis-examples/ Would anyone happen to have a suggestion? Thank you! Leah <script type="text/javascript"> jQuery(document).ready(function($) { $('a[href*="#"]') // Remove links that don't actually link to

ScrollTop really jerky in Chrome

偶尔善良 提交于 2019-12-02 04:12:29
I'm using the scrollTop function to create a parallax scrolling website, binding the scrollTop function to different anchors throughout my website. The problem I'm having is that the scrolling becomes really choppy/jerky in Chrome, but somehow its fine in Firefox. My code is as follows: $('.recipes').click(function(){ $('html,body').animate({ scrollTop: $(".main1").offset().top }, 1500); }); $('.cooking').click(function(){ $('html,body').animate({ scrollTop: $(".main2").offset().top }, 1500); }); Is there possibly an alternate way to do this so the website scroll isn't as jerky? maybe an

JavaFX TableView scrollTo() causing wrong row to start editing

二次信任 提交于 2019-12-02 03:25:43
问题 I have an editable TableView with a button that adds a new row then calls table.edit() on the first column in that row. When a user wants to add a row that will be out of the viewport, what should happen is the table scrolls the new row within the viewport and starts editing. However, calling table.scrollTo(newRow) causes all sorts of buggy behavior. The row is brought into view, but only some of the time goes into editing. What seems to happen the most is the first row within the viewport

jScrollPane scrollbar disappears when applying scrollTo

眉间皱痕 提交于 2019-12-02 03:02:23
I have a problem with the jQuery extension jScrollPane combined with the scrollTo plugin. The scrollbar disappears if I apply the scrollTo command to the scrollable container and the scroll is at the top position . (If the scroll is not at the top position, everything is working fine.) To get the scrollbar back, I try to reinitialize it. What happens then is that the scroll goes back to the top, canceling the scrollTo command. My code: $('#myScrollableDiv div.jspContainer').scrollTo(delta); c = $('#myScrollableDiv').jScrollPane({ autoReinitialise: true, maintainPosition: true }); If you use