Register

If this is your first visit, please click the Sign Up now button to begin the process of creating your account so you can begin posting on our forums! The Sign Up process will only take up about a minute of two of your time.

Results 1 to 5 of 5
  1. #1
    Junior Member
    Join Date
    Jan 2013
    Posts
    3
    Member #
    34392
    I've been visiting the following websites:

    graphikamanila.com
    jffc.tomasinoweb.org

    And the navigation/links they have uses the # in the HREF attribute. However, I haven't been able to explore HTML5 as much. Whenever I use the # in coding pages, it only 'jumps' to that part of the page. There is no transition being applied. I'm not sure if it's a CSS effect or what. Can you please maybe put up part of the code or something? Can anyone please help me? Visiting the websites I've listed would help you in understanding my question.

    Thanks!

  2.  

  3. #2
    Member
    Join Date
    Nov 2012
    Location
    Tampa. FL
    Posts
    59
    Member #
    33844
    Liked
    21 times
    This effect is achieved by using javascript or jquery.
    Let's say you have a link and assign a class to it for your navigation:
    <a href="#" class="nav">Home</a>

    Then you use jquery to handle the click:
    $('a.nav').on("click", function(e){
    e.preventDefault();
    });

    We assign a function to the click event with the parameter "e" which references the click event.
    Then we use e.preventDefault(); to prevent the default action of the click (which would be to go to the top of the page, causing a refresh).
    Freelance Web Developer

  4. #3
    Junior Member
    Join Date
    Jan 2013
    Posts
    3
    Member #
    34392
    Quote Originally Posted by ekim941, post: 246039
    This effect is achieved by using javascript or jquery.
    Let's say you have a link and assign a class to it for your navigation:
    <a href="#" class="nav">Home</a>

    Then you use jquery to handle the click:
    $('a.nav').on("click", function(e){
    e.preventDefault();
    });

    We assign a function to the click event with the parameter "e" which references the click event.
    Then we use e.preventDefault(); to prevent the default action of the click (which would be to go to the top of the page, causing a refresh).
    Hi! Thanks for answering me. I'm not really familiar with jQuery. However, I do understand the code you placed above. Is there some sort of name to this effect so I can search more about it?

  5. #4
    Member
    Join Date
    Nov 2012
    Location
    Tampa. FL
    Posts
    59
    Member #
    33844
    Liked
    21 times
    preventDefault is the name of the effect/function.
    Freelance Web Developer

  6. #5
    Junior Member
    Join Date
    Jan 2013
    Posts
    3
    Member #
    34392
    Quote Originally Posted by ekim941, post: 246043
    preventDefault is the name of the effect/function.
    I see... Thanks then!


Remove Ads

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
All times are GMT -6. The time now is 04:20 PM.
Powered by vBulletin® Version 4.2.3
Copyright © 2019 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com