[jQuery] Re: jQuery Cycle Plugin and Links
Hi there,
I am having a similar issue, but the functionality I want to achieve
is a bit simpler. Right now I want to apply a link of my choosing to
each slide (in the HTML of the slide), but t this breaks the alt
information pulled from the the pager and displays an "undefined"
error on the page. I don't quite know how to achieve this in the code.
This is a snippet of my pager code:
.after('')
pager:'#nav',
pagerAnchorBuilder: function(idx, slide) {
var navlabel = $($(slide).html() +'img').attr('alt');
return '' + navlabel + '';
}
}
This is my current jQuery cycle HTML Code for each slide:
Title Headline
Caption Text and other HTML
Same code as above but different image and caption content
I want to manually add a custom href around the slide image src (like
the example code below) but it completely breaks it the pager
navigation and shows "undefined" error:
Title Headline
Caption Text and other HTML
How can I do this?
Many thanks,
Danielle
On Jul 22, 8:35 am, Charlie wrote:
> the details you want to display can also be contained elsewhere if you want
> by using the index of the current slide to match the index of another set of
> containers
> function onAfter(curr, next, opts) {
> var index = opts.currSlide;
> // use index to refernece other containers to work with
> }
> thus you can hide a series of containers and display the ones you want on
> each slide. Also can use the onBefore to hide, animate or whatever to remove
> the info showing , let new slide show up, then add new info with onAfter
> Mescalero wrote:Thanks guys, Using that, this is what i have: $(function() {
> $('#slides').before('').cycle({ fx: 'fade', speed:
> 'fast', timeout: 0, pager: '#nav', after: onAfter }); }); function onAfter()
> { $('#article-description').html("" + this.title + "")
> .append('' + this.alt + ' Read more ›'); }
> and then in the body i have something like: src="images/features/botanical.jpg" width="388" height="218" title="Botanical
> Garden" alt="Almost 300 acres, the botanical garden has miles of streams and
> nature trails, display gardens, and flowers and plants."
> link="http://www.scbg.com"/> the only problem is that this.link is coming up
> undefined. I am curious where i need to define it so that it will pick up the
> link attribute like it does "src" and "title." If i just put the link in the
> unused 'name" attribute and change to + this.name it also works, but that i
> may want other attributes later down the road...does this make sense? Matt On
> Jul 20, 7:07 pm, Mike Alsupwrote:I would like to add
> another attribute to the img tag called "link."This attribute would define
> where theimagewould link to if someone clicks theimage.Then i could do
> something like: .append('' + this.alt + ' Read
> more ›');Does anyone know what/where i can add in thecyclejs to
> accomodate for this.link?Check out the 'callbacks' example on this
> page:http://www.malsup.com/jquery/cycle/int2.html
[jQuery] Re: jQuery Cycle Plugin and Links
the details you want to display can also be contained elsewhere if you
want by using the index of the current slide to match the index of
another set of containers
function onAfter(curr, next, opts) {
var index = opts.currSlide;
// use index to refernece other containers to work with
}
thus you can hide a series of containers and display the ones you want
on each slide. Also can use the onBefore to hide, animate or whatever
to remove the info showing , let new slide show up, then add new info
with onAfter
Mescalero wrote:
Thanks guys,
Using that, this is what i have:
$(function() {
$('#slides').before('').cycle({
fx: 'fade',
speed: 'fast',
timeout: 0,
pager: '#nav',
after: onAfter
});
});
function onAfter() {
$('#article-description').html("" + this.title + "")
.append('' + this.alt + ' Read
more ›');
}
and then in the body i have something like:
"http://www.scbg.com" />
the only problem is that this.link is coming up undefined. I am
curious where i need to define it so that it will pick up the link
attribute like it does "src" and "title." If i just put the link in
the unused 'name" attribute and change to + this.name it also works,
but that i may want other attributes later down the road...does this
make sense?
Matt
On Jul 20, 7:07 pm, Mike Alsup wrote:
I would like to add another attribute to the img tag called "link."
This attribute would define where the image would link to if someone
clicks the image.
Then i could do something like: .append('' + this.alt + ' Read more ›');
Does anyone know what/where i can add in the cycle js to accomodate
for this.link?
Check out the 'callbacks' example on this page:
http://www.malsup.com/jquery/cycle/int2.html
[jQuery] Re: jQuery Cycle Plugin and Links
Thanks guys,
Using that, this is what i have:
$(function() {
$('#slides').before('').cycle({
fx: 'fade',
speed: 'fast',
timeout: 0,
pager: '#nav',
after: onAfter
});
});
function onAfter() {
$('#article-description').html("" + this.title + "")
.append('' + this.alt + ' Read
more ›');
}
and then in the body i have something like:
http://www.scbg.com"; />
the only problem is that this.link is coming up undefined. I am
curious where i need to define it so that it will pick up the link
attribute like it does "src" and "title." If i just put the link in
the unused 'name" attribute and change to + this.name it also works,
but that i may want other attributes later down the road...does this
make sense?
Matt
On Jul 20, 7:07 pm, Mike Alsup wrote:
> > I would like to add another attribute to the img tag called "link."
>
> > This attribute would define where the image would link to if someone
> > clicks the image.
>
> > Then i could do something like: .append('' + this.alt + ' Read more ›');
>
> > Does anyone know what/where i can add in the cycle js to accomodate
> > for this.link?
>
> Check out the 'callbacks' example on this page:
>
> http://www.malsup.com/jquery/cycle/int2.html
[jQuery] Re: jQuery Cycle Plugin and Links
> I would like to add another attribute to the img tag called "link."
>
> This attribute would define where the image would link to if someone
> clicks the image.
>
> Then i could do something like: .append('' + this.alt + ' Read more ›');
>
> Does anyone know what/where i can add in the cycle js to accomodate
> for this.link?
Check out the 'callbacks' example on this page:
http://www.malsup.com/jquery/cycle/int2.html
[jQuery] Re: jQuery Cycle Plugin and Links
you can use the "before" and "after" options in the API to write
functions that trigger on each slide to do what you want
Mescalero wrote:
I would like to add another attribute to the img tag called "link."
This attribute would define where the image would link to if someone
clicks the image.
Then i could do something like: .append('' + this.alt + ' Read more ›');
Does anyone know what/where i can add in the cycle js to accomodate
for this.link?
