smooth scrolling jquery in iframe

Discussion in 'Web Design and Development' started by Flood123, Jul 11, 2012.

  1. Flood123 macrumors 6502a

    Flood123

    Joined:
    Mar 28, 2009
    Location:
    Living Stateside
    #1
    Having issues. I coded a page with smooth scrolling navigation for a client. Come to find out after the fact, the client is pulling my page in with an iframe. Not sure why if they are using asp.net. The jquery is not working when the page is opened through the iframe(not sure if it can work). This is the jquery I have Thanks in advance. I sincerely appreciate it. anyone out there with any helpful suggestions ?

    <script>
    $(document).ready(function(){
    $(‘a[href*=#]‘).click(function() {
    if (location.pathname.replace(/^\//,”) == this.pathname.replace(/^\//,”)
    && location.hostname == this.hostname) {
    var $target = $(this.hash);
    $target = $target.length && $target
    || $(‘[name=' + this.hash.slice(1) +']‘);
    if ($target.length) {
    var targetOffset = $target.offset().top;
    $(‘html,body’)
    .animate({scrollTop: targetOffset}, 1000);
    return false;
    }
    }
    });
    });
    </script>
     
  2. Flood123 thread starter macrumors 6502a

    Flood123

    Joined:
    Mar 28, 2009
    Location:
    Living Stateside
    #2
    Clarification. The jQuery code above is in my doc that is in the page pulled up through the iframe. for one reason or another when the height is removed from the iframe code the navigation works but obviously the height is way off and kinda caves in on itself.

    I am using:
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
    <script>
    $(document).ready(function(){
    $(‘a[href*=#]‘).click(function() {
    if (location.pathname.replace(/^\//,”) == this.pathname.replace(/^\//,”)
    && location.hostname == this.hostname) {
    var $target = $(this.hash);
    $target = $target.length && $target
    || $(‘[name=' + this.hash.slice(1) +']‘);
    if ($target.length) {
    var targetOffset = $target.offset().top;
    $(‘html,body’)
    .animate({scrollTop: targetOffset}, 1000);
    return false;
    }
    }
    });
    });
    </script>
     

Share This Page