Note that there are some explanatory texts on larger screens.

plurals
  1. PODisplay #anchor instead of index in URL, with jQuery Cycle
    primarykey
    data
    text
    <p>To be Google friendly, I want to change this script a little bit. </p> <p>I have a one page layout, where I use jQuery Cycle to animate between content. The script, as it is now, displays the current slide's number in the URL. Ex. "index.html#1" or "index.html#4". It looks horrible and I think Google would think too... ;-)</p> <p>I want it to display the divs #anchor instead of its index, so the url would be "index.html#Projects" instead</p> <p><strong>The HTML menu:</strong></p> <pre><code> &lt;div id="menu"&gt; &lt;ul&gt; &lt;li&gt;&lt;a href="#About"&gt;About&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="#Projects"&gt;Projects&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="#Learning"&gt;Learning&lt;/a&gt;&lt;/li&gt; &lt;/ul&gt; &lt;/div&gt; </code></pre> <p><strong>The script:</strong></p> <pre><code>//Set .active to current page link var url = location.hash.slice(1); if (url &lt; 1 ) { $("#menu li:nth-child(" + ( location.hash.slice(1) - 1 ) + ") a ").addClass("active"); } //Slide effect $('#logo').click(function() { $('.slideshow').cycle(0); return false; }); $('#menu li a').click(function() { $('.slideshow').cycle($(this).parent().index()+1); return false; }); $('.slideshow').cycle('pause'); var index = 0, hash = window.location.hash; if (hash) { index = /\d+/.exec(hash)[0]; index = (parseInt(index) || 1) - 1; // slides are zero-based } $('.slideshow').cycle({ fx: 'blindY', // choose your transition type, ex: fade, scrollUp, shuffle, etc... speed: 700, startingSlide: index, cleartype: 1, timeout: 3000, after: function(curr,next,opts) { window.location.hash = opts.currSlide + 1; } }); </code></pre> <p>Is it possible to make it display the divs #anchor instead of its index?</p> <p>Thank you in advance... :-)</p>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload