Home › Forums › JavaScript › AnythingSlider – Appending Forward and Back Buttons (half working)
- This topic is empty.
-
AuthorPosts
-
November 23, 2012 at 10:39 am #40953Paesano2000Participant
Hello! So I have been trying to figure out how to use the **appendFowardTo** and **appendBackTo** functions to some HTML elements, but so far I have had little luck.
I forked one of Mottie’s jsfiddle playgrounds to work with the settings and so far only the _appendBackTo_ seems to be working… check out the jsfiddle here.
Any idea why the _appendFowardTo_ function isn’t working but the _appendBackTo_ is?
The whole reason I looked into this was to achieve setting a link tag to advance the slider forward. Could someone offer a solution for both the issue with the appendBackTo, and allowing a link to trigger the “go forward” functionality?
Thanks!
November 23, 2012 at 12:40 pm #115253Watson90MemberYou’re simply spelling forward wrong;
I have forked this for you and it works fine now.
November 23, 2012 at 1:20 pm #115255Paesano2000ParticipantHow the hell did I miss that? Lol
I see why now… I took Mottie’s jsfiddle to have no errors in it: http://jsfiddle.net/Mottie/VM8XG/
It was misspelt in the fiddle I forked…Any help however on a function that will advance the player forward or backward would be nice. I do have this one, but it requires the specific hastag # of the slide:
$('.advance-button').click(function(){var slide = $(this).attr('href').substring(1);
$('#slider').stop().anythingSlider(slide);
return false;
});
November 23, 2012 at 1:57 pm #115259Watson90MemberHow do you mean advance it forward and backward?
November 23, 2012 at 4:40 pm #115281Paesano2000ParticipantThere is a function in the plugin that advances the slides forward or backward which is tied into the default arrow buttons that are generated.
I want to take that functionality and apply it to an event (click, hover, etc.) on any other element I wish, instead of having to use _appendForwardTo_, which generates its own HTML elements. With this I can also tie in some other events to happen when the user advances the slider forward.
Understand what I’m getting at?
November 23, 2012 at 8:00 pm #115290MottieMemberHiya!
Yeah I’m a gud speeler. I fixed that in the newer playground versions, so I thought it wasn’t going to haunt me! LOL oh well.
You can use the AnythingSlider api to advance the slides forward and back like this ([here’s a demo](http://jsfiddle.net/Mottie/XkHvg/1/))
var api = $(‘#slider’).data(‘AnythingSlider’);
$(‘.go-forward, .go-back’).click(function(){
if ($(this).hasClass(‘go-forward’)) {
api.goForward();
} else {
api.goBack();
}
return false;
});
Here is a more condensed version that is harder to read but does exactly the same thing:var api = $(‘#slider’).data(‘AnythingSlider’);
$(‘.go-forward, .go-back’).click(function(){
api[$(this).hasClass(‘go-forward’) ? ‘goForward’ : ‘goBack’]();
return false;
});November 26, 2012 at 1:03 pm #115536Paesano2000ParticipantHeya Mottie,
Haha damn typos! I was trying to figure out what was going on for hours!
Wow, that is super awesome! I totally missed [the API section](https://github.com/CSS-Tricks/AnythingSlider/wiki/Callbacks-and-Events#wiki-functions “”).
Thank you so much for your help and the work you do on the plugin :)
-
AuthorPosts
- The forum ‘JavaScript’ is closed to new topics and replies.