Learn how to a build a cloud-first strategyRegister Now

x
?
Solved

Javascript slideshow with images sliding in from the left

Posted on 2009-02-09
2
Medium Priority
?
380 Views
Last Modified: 2012-06-27
I'm trying to create a slide show in which the new image slides in from the left to cover the current image.  Or the current image slides off to the right revealing the new image underneath it.

The way it is now, when you choose animation type 'slide' or 'slidefade', the images come from and return to the upper left corner, zooming in and out at the same time. What is causing that in the javascript, and how do I modify the script so that they just slide in and out as I described above?

Thanks,

John

This is a followup to: http://www.experts-exchange.com/Programming/Languages/Scripting/JavaScript/Q_24084781.html
0
Comment
Question by:gabrielPennyback
2 Comments
 
LVL 16

Accepted Solution

by:
sh0e earned 2000 total points
ID: 23597345
Perhaps something like
http://malsup.com/jquery/cycle/
or
http://sorgalla.com/projects/jcarousel/
might better fit your needs?
0
 
LVL 1

Author Comment

by:gabrielPennyback
ID: 23607988
Very helpful links, sh0e, thanks. These are very cool, much cooler than what I was trying to do.

Still I would love to know how to modify the script you gave me to work different ways. For eaxmple I tried fooling around with this bit of code and nothing I do changes the way it works.

else if (settings.animationtype=='slideright'){
            $(elements[last]).animate({width:'hide'},settings.speed);
           $(elements[current]).animate({width:'show'},settings.speed);

I even commented out the active lines and it still worked the same way. ???

else if (settings.animationtype=='slideright'){
           // $(elements[last]).animate({width:'hide'},settings.speed);
           //$(elements[current]).animate({width:'show'},settings.speed);

So how would I code it so that the current image stays exactly where it is and the new image slides in from the left right over it?

Obviously the ready made stuff is way better than I could come with, but I just want to get a better grasp of the language of javascript, and no what words produce what results.

If you can get me to learn that much here, I promise I'll stop bothering you for a while :-)

Here's my latest: http://www.discretedata.com/JCRD/WREM/SlideFade_v3.html

Thanks,

John
0

Featured Post

Independent Software Vendors: We Want Your Opinion

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Introduction Knockoutjs (Knockout) is a JavaScript framework (Model View ViewModel or MVVM framework).   The main ideology behind Knockout is to control from JavaScript how a page looks whilst creating an engaging user experience in the least …
I found this questions asking how to do this in many different forums, so I will describe here how to implement a solution using PHP and AJAX. The logical flow for the problem should be: Write an event handler for the first drop down box to get …
The viewer will learn how to dynamically set the form action using jQuery.
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
Suggested Courses
Course of the Month20 days, 16 hours left to enroll

810 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question