Avatar of tlengnick
tlengnick
Flag for United States of America asked on

Slide Show in HTML

I want to present about 5 images on my webpage that:
1) Are automatically replaced by another images sliding in from the right as the existing images slides out to the left.
and
2) Are able to be presented by clicking a little radio button below the image holder.

See the first image at http://quodis.com/ for an example.

Thanks!
HTMLJavaScript

Avatar of undefined
Last Comment
tlengnick

8/22/2022 - Mon
Tom Beck

That site uses jCarousel. What's your question?

http://sorgalla.com/jcarousel/
tlengnick

ASKER
My question is how to make "that" happen on my webpage. I have a test folder with the following files in it.

Image01.jpg
Image02.jpg
Image03.jpg
Image04.jpg
Image05.jpg
jcarousel-test.css
jcarousel-test.html
jquery.js

You can view my results here:
http://www.psychtrain.com/test/jcarousel-test.html

You can access any of these files in the test folder to inspect them, e.g.
http://www.psychtrain.com/test/jcarousel-test.css


I've read the instructions and tried to make it work but have been unsuccessful.
tlengnick

ASKER
jquery.jcarousel.js is also in that folder.
All of life is about relationships, and EE has made a viirtual community a real community. It lifts everyone's boat
William Peck
Ioannis Paraskevopoulos

Hi,

I have set up a working example here.

Giannis
tlengnick

ASKER
Hi Giannis,

This is great! Just a couple of questions:

1) Where do I put the javascript that is in the lower-left-hand quadrant? I put it in the body of my html and that didn't work.

2) Do I need the jquery.js or jquery.jcarousel.js files? I don't see them referenced in any of the code.

Thanks for the example!
Ioannis Paraskevopoulos

Yes, you need to referense these. They are referenced in jsfiddle in the External Resources section on the left.

Giannis
Get an unlimited membership to EE for less than $4 a week.
Unlimited question asking, solutions, articles and more.
tlengnick

ASKER
Arggh!

So, I've now referenced the js files (I believe I have--this is my first time doing any of this, if you hadn't noticed)...here is the reference code in the body of my html file:

<script type="text/javascript" src="jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="jquery.jcarousel.min.js">                                                                                                                                 function mycarousel_initCallback(carousel)
{
    // Disable autoscrolling if the user clicks the prev or next button.
    carousel.buttonNext.bind('click', function() {
        carousel.startAuto(0);
    });
...etc...

I went to http://code.jquery.com/ and found jquery-1.4.2.min.js...i opened it, copied all and created a new ANSI file and put all that code in it and saved as jquery-1.4.2.min.js.

I am getting only 3 of the images showing now, so something's working...but no automation yet...

Any ideas?
root.jpg
Ioannis Paraskevopoulos

Can you give me the modified HTML file you have?
tlengnick

ASKER
Yes. I will always upload my latest html to http://www.psychtrain.com/test/jcarousel-test.html

Thanks for your continued help!
This is the best money I have ever spent. I cannot not tell you how many times these folks have saved my bacon. I learn so much from the contributors.
rwheeler23
tlengnick

ASKER
I just noticed that after I upload jcarousel-test.html, the code is slightly changed on the server side.

It's automatically adding the following line immediately after the <body> tag:

<script type='text/javascript' language='javascript' src='/B1D671CF-E532-4481-99AA-19F420D90332/netdefender/hui/ndhui.js?0=0&amp;0=0&amp;0=0'></script>

Also...I'm using DotEasy as my domain host...any chance they limit js somehow?
Ioannis Paraskevopoulos

I think i found what is going on....
ASKER CERTIFIED SOLUTION
Ioannis Paraskevopoulos

Log in or sign up to see answer
Become an EE member today7-DAY FREE TRIAL
Members can start a 7-Day Free trial then enjoy unlimited access to the platform
Sign up - Free for 7 days
or
Learn why we charge membership fees
We get it - no one likes a content blocker. Take one extra minute and find out why we block content.
Not exactly the question you had in mind?
Sign up for an EE membership and get your own personalized solution. With an EE membership, you can ask unlimited troubleshooting, research, or opinion questions.
ask a question
tlengnick

ASKER
Hey! It works!!

Thank you so much!
Get an unlimited membership to EE for less than $4 a week.
Unlimited question asking, solutions, articles and more.