Reply to comment

Visitor's picture
Visitor commented on #1

Hi Cory, great tutorial! Well documented and very clear.

BUT .. I am having an issue:

I want to implement just the functionality up to Step 8 (just a simple scrollTo).

My markup is equivalent to the example you use:

My Index (your "Questions") looks like this:

<ul id="index">
<li id="index-title-0"><a href="#sub-title-0">Index 0</a></li>
<li id="index-title-1"><a href="#sub-title-0">Index 1</a></li>
</ul>

My Sub-titles (your "Answers") looks like this:

<div id="sub-title-0"><h2>Title 0</h2></div>
<div id="sub-title-1"><h2>Title 0</h2></div>

My javascript file looks like this:

$(function() {
        $("#index > li").click(function() {
                var fromIndex = $(this).attr("id");
                var toTitle = "#" + fromIndex.replace("index","sub");
                $.scrollTo(toTitle, {duration: 800, axis:"y"});
            });
});

When I click on the anchor, it does a normal jump: ie. toScroll is not working.
I have checked all of the javascript code and it all outputs the correct value. The only issue is with the line:

$.scrollTo(toTitle, {duration: 800, axis:"y"});

.. which it says is not defined.

I have checked and jQueryScrollTo.js is being loaded, as it appears in the header. (I am also using Drupal 6 so added the js in the my_theme.info file)

I have used several jQuery scripèts before with success so I am a little confused as to why I cannot get this one to work.

Any ideas?

Reply

The content of this field is kept private and will not be shown publicly. If you have a Gravatar account, used to display your avatar.
  • Web page addresses and e-mail addresses turn into links automatically.
  • Allowed HTML tags: <a> <em> <strong> <cite> <code> <ul> <ol> <li> <dl> <dt> <dd><img>
  • You can enable syntax highlighting of source code with the following tags: <code>, <blockcode>, <css>, <drupal>, <java>, <javascript>, <mysql>, <php>, <ruby>. The supported tag styles are: <foo>, [foo]. PHP source code can also be enclosed in <?php ... ?> or <% ... %>.
  • Lines and paragraphs break automatically.

More information about formatting options

CAPTCHA

This question is for testing whether you are a human visitor and to prevent automated spam submissions.