开发者

javascript not functioning when "examplelink.php#anchor" is clicked

I really, really hope someone will help me with this! Thank you sooo much if you do! :)

I have two pages... one named index.php and one named portfolio.php. My header (same on every page) contains some anchors rederecting them to the portfolio.php page (portfolio.php#blogg).

I also have a javascript code for 开发者_开发知识库smooth scrolling (this should work on all pages), but it does not work on the header anchor links when I'm in another page then portfolio.php.

What can I do to get the javascript to function when I for example press "portfolio.php#blogg" in the index.php page?

Heres my javascript:

window.addEvent('domready',function() { new SmoothScroll({ duration: 800 }); });


Hmmm.... The problem, if I understand correctly, is that the browser jumps down to the fragment anchor position when arriving from another page, before the SmoothScroll object is loaded. The first thing that comes to mind would be a solution that uses sessions or cookies.

When a user is on the index page and clicks on a link to portfolio that should scroll to the #blogg anchor: Instead of adding the hashtag fragment to the URL of the link, save a cookie that indicates the page should be scrolled and link directly to the top of the portfolio page.

Then, in the portfolio page domready event, load the SmoothScroll object, check for the presence of the cookie, scroll to the #blogg anchor if it exists, and remove the cookie.


You're not giving us much information here, but I'm assuming that SmoothScroll is the one from MooTools? Take a look at this: http://davidwalsh.name/mootools-onload-smoothscroll

window.addEvent(‘domready’, function() {
    new SmoothScroll({ duration:700 }, window);
    var el = window.location.hash.substring(1); // the hash
    if(el) {
        window.scrollTo(0,0);
        var scroll = new Fx.Scroll(
            window,
            { wait: false, duration: 700, transition: Fx.Transitions.Quad.easeInOut }
        );
        scroll.toElement(el);
    }
});
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜