Jared Heinrichs

  • Technology Blog
  • Winnipeg Computer Repair
  • Winnipeg Photographer
  • Cooking With Jared
You are here: Home / Programming / jQuery / Clicking on hyperlink causes page to jump to the top

Apr 19, 2011 By Jared Heinrichs 1 Comment

Clicking on hyperlink causes page to jump to the top

I found a fix to an issue that was driving me nuts. If I told a jquery do run an animation when I clicked on a hyper-link the page would “magically jump” to the top of the screen. When the page was “jumping” to the top of the screen the jquery animation was actually happening. By the time you scrolled down back to down the page you would only see that the object had moved.

Up until now I would just write something like:

  • <a href=”#”>Click me</a>

While doing this isn’t an issue if the jquery animation happens at the top of the page, if you want to run an animation somewhere down the page the jumping result is really unwanted.

Thanks to http://corpocrat.com/2009/07/12/fix-jquery-onclick-browser-jumps-to-top-of-page/ I realized I need to change the code so that it looks like this:

  • <a href=”javascript:void(0);” onclick=”dofunc()”>Click me</a>

Hope this helps you if you are experiencing the issue where clicking on a hyperlink causes the page to jump to the top of the screen.

Filed Under: jQuery

Comments

  1. Jessie A. Morris says

    Jul 27, 2011 at 11:17 am

    One other way to do this would be to assign a function for onclick that returns false. Returning false stops the event from propigating upwards. This stops the default action of an anchor tag (going to the top).

Leave a Reply Cancel reply

Your email address will not be published. Required fields are marked *

Categories

  • Board Game Rules
  • Camera
  • Computer Hardware
    • Blackberry
    • drivers
    • iPad
    • Magic Jack
    • USB
  • Damn Small Linux
  • Exam Notes
  • Facebook
  • FREE Flashcards
  • Games
    • PC
      • League of Legends
    • Wii
    • xbox 360
  • Music
  • Networking
    • Cisco Certification
    • Mitel
    • Palo Alto Firewall
  • News
    • Google
    • Microsoft
  • Operating System
    • Active Directory (2003)
    • Android
    • Command Prompt
    • Damn Small Linux
    • Group Policy
    • Hyper-V
    • IIS
    • ISA 2006
    • Mac OS X
    • Microsoft Exchange Server
    • Powershell
    • Security
    • SME Server
    • Terminal Server 2003
    • Ubuntu Linux
      • Adito Web SSL VPN
      • OpenVpn-als
      • Webmin
    • Virtual Machine Manager
    • Windows 2003 SBS
    • Windows 2003 Server
    • Windows 2008
    • Windows 2008 R2
    • Windows 2012R2
    • Windows 7
    • Windows 8
    • Windows Command Line
    • Windows Deployment Services
    • Windows Server Backup
    • Windows Vista
    • Windows XP
  • Phones
  • Photography
  • Photos
    • Animals
    • Misc
    • Nature
    • Portraits
  • Portfolio
  • Programming
    • CSS
    • HTML
    • jQuery
    • MySQL
    • PHP
    • Script
  • Programs
    • Acrobat
    • Acrobat Reader
    • Adobe Dreamweaver
    • Adobe Illustrator
    • Adobe Photoshop
    • Anti-virus Software
    • Antivirus
    • Backup Exec
    • Bittorent
    • Blackberry BESADMIN
    • Internet Explorer 9
    • Lightroom
    • Microsoft Office
    • Netbeans
    • Onenote
    • Outlook
    • Shelby
    • Sysprep
    • Trend
    • Video Editing
    • Visual Studio
    • Windows Live Writer
    • WireShark
    • XP Mode
    • Zarafa
  • Recipe
  • Review
  • Software Links
  • Troubleshooting
  • Uncategorized
  • Videos
  • Web Applications
    • Brage
    • Google
    • Spiceworks
    • Wordpress
  • Web Browsers
    • Internet Explorer
  • Web Server
    • XAMPP
  • Winnipeg
    • ISP

Try searching this site!

Copyright © 2021 Winnipeg Web Design