PDA

View Full Version : Unobtrusive jquery for a cycle



icklechurch
Nov 16th, 2009, 05:27 PM
Hi,

Does anyone know how to make the cycle function in jquery unobtrusive?

I've got the following code and when I disable javascript, I get a nasty long list of images :(

Jquery code:

$(document).ready(function() {
$('.homepage-slideshow').cycle({
fx: 'fade',
before: onAfter,
pause: 1,
timeout: 0,
pager: '#nav'
});
});

function onAfter() {

var cycle_href = this.href;
var brokenstring = this.title.split(" :: ");

var cycle_title = brokenstring[0];
var cycle_descr = brokenstring[1];

$('#output').html('<a href="'+cycle_href+'">'+cycle_title+'</a>');
$('#output-descr').html(cycle_descr);


}

Html code:

<div class="homepage-slideshow">
<a href="http://url.com/" title="Info goes here."><img src="<?=SITE_URL?>/images/image1.jpg" alt="Click here for more on ..." ></a>

<a href="http://url2.com/" title="Info goes here."><img src="<?=SITE_URL?>/images/image2.jpg" alt="Click here for more on ..." ></a>




</div>
<div class="homepage-pagination" id="nav" >Click the links to start the Google Tour: </div>
<div class="homepage-metadata">
<p id="output-descr"></p>
<h3 id="output"></h3>
</div>

Philip M
Nov 16th, 2009, 05:39 PM
Perhaps you would do better to post this in the jQuery (JavaScript frameworks) forum.