CODEWITHSUNDEEP
jquerycss
Prasath V
Prasath V

Reputation: 1356

Navigate to a div on a different page with smooth scrolling

I'm trying to do smooth scroll while clicking the a elements in .panel class. It was redirecting to the coressponding id. But smooth scroll doesn't works.

index.php

<div class="panel">
    <p><a href="gallary.php#singleclr_led">SINGLE COLOUR LED</a></p>
    <p><a href="gallary.php#doubleclr_led">TWO COLOUR LED</a></p>
    <p><a href="gallary.php#multiclr_led">MULTI COLOUR LED</a></p>
    <p><a href="gallary.php#indoor_led">INDOOR LED DISPLAY</a></p>
    <p><a href="gallary.php#outdoor_led">OUTDOOR LED DISPLAY</a></p>
</div>

jquery

$('.panel a').click(function(){
    $('html, body').animate({
        scrollTop: $( $(this).attr('href') ).offset().top
    }, 500);
    return false;
});

gallary.php

 <div class="col-md-6 col-xs-12 gallary-img1" id="multiclr_led">
                <div class="hovereffect">
                    <img src="images/colorimg.jpg" class="img-responsive "alt="">
                    <div class="overlay">
                        <h2>MULTI COLOUR LED</h2>
                        <div class="hover-content">
                            <P>6 colors are possible like in addition to RGB, they are cyan, magenta & yellow. This property is well utilized by the motherboard manufacturer, to show the power indication, RED means lower power than the recommended rating, green means ambient power etc. So they compacted the space requirements.</P>
                        </div>
                    </div>
                </div>
            </div>

Can't find the problem. Help this issue. Thanks in advance.

Upvotes: 0

Views: 847

Answers (1)

andreivictor
andreivictor

Reputation: 8491

Try with the following code (put it in gallery.php file):

$(document).ready(function(){

    var anchor = window.location.hash;

    if ( $(anchor).length > 0 ) {

        $('html, body').animate({
            scrollTop: $(anchor).offset().top
        }, 500);

    }
});

Upvotes: 1

Related Questions