Photo Slideshow - Post ID 229493

User 2147626 Photo


Ambassador
2,958 posts

Did you follow Step 1 ? You have to download the .js files to your computer, and then add them to your VSD site. Without the .js files it won't work. Let us know.
Graphics for the web, email, blogs and more!
-------------------------------------
https://sadduck.com
User 2592917 Photo


Registered User
8 posts

yes, it's in my root folder and the images are in a seperate folder named jqueryslideshow

User 187934 Photo


Senior Advisor
20,181 posts
Online Now

These files are missing
http://jseibold.coffeecup.com/js/jquery.min.js
http://jseibold.coffeecup.com/js/jquery.cycle.all.js
Also all the images.
http://jseibold.coffeecup.com/jquerysli … sopa_1.jpg
I can't hear what I'm looking at.
It's easy to overlook something you're not looking for.

This is a site I built for my work.(RSD)
http://esmansgreenhouse.com
This is a site I built for use in my job.(HTML Editor)
https://pestlogbook.com
This is my personal site used for testing and as an easy way to share photos.(RLM imported to RSD)
https://ericrohloff.com
User 2592917 Photo


Registered User
8 posts

is this for the body or header?



Eric Rohloff wrote:
Remove the html that you pasted into the html box and replace it with this.
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.cycle.all.js"></script>
<style type="text/css">
.pics { height: 382px; width: 557px; padding:0; margin:0; overflow: hidden }
.pics img { height: 350px; width: 525px; padding: 15px; border: 1px solid #ccc; background-color: #eee; top:0; left:0 }
.pics img {
-moz-border-radius: 10px; -webkit-border-radius: 10px;
</style>
<script type="text/javascript">
$('#slideshow').cycle({
fx: 'fade',
timeout: 2000,
speed: 2000,
autostop: 1,
});
</script>

For some reason when users copy some of my codes it puts some spaces in the script where it doesn't belong. I removed them for you on the above code.
User 187934 Photo


Senior Advisor
20,181 posts
Online Now

Header
I can't hear what I'm looking at.
It's easy to overlook something you're not looking for.

This is a site I built for my work.(RSD)
http://esmansgreenhouse.com
This is a site I built for use in my job.(HTML Editor)
https://pestlogbook.com
This is my personal site used for testing and as an easy way to share photos.(RLM imported to RSD)
https://ericrohloff.com
User 2592917 Photo


Registered User
8 posts

I have published the site through VSD to the s drive for testing purposes but the files didn't seem to transfer, I must be doing something wrong. Am I missing a step in the upload process. The files show when I click "add files" and open the root folder. In preview I see the pictures but they are displayed vertically on top of each other (all at once, there isn't a slideshow) and my title is moved down off the top of the page for some reason.
Thank you for your time
User 187934 Photo


Senior Advisor
20,181 posts
Online Now

I would retrace your steps to make sure the files are in the proper location.
The images should be in a folder named jqueryslideshow
I can't hear what I'm looking at.
It's easy to overlook something you're not looking for.

This is a site I built for my work.(RSD)
http://esmansgreenhouse.com
This is a site I built for use in my job.(HTML Editor)
https://pestlogbook.com
This is my personal site used for testing and as an easy way to share photos.(RLM imported to RSD)
https://ericrohloff.com
User 2592917 Photo


Registered User
8 posts

This is my body:

<div id="slideshow">
<img src="jqueryslideshow/ssopa_1.jpg" alt="Slideshow Image 1" /></a>
<img src="jqueryslideshow/ssopa_2.jpg" alt="Slideshow Image 2" /></a>
<img src="jqueryslideshow/ssopa_3.jpg" alt="Slideshow Image 3" /></a>
<img src="jqueryslideshow/ssopa_4.jpg" alt="Slideshow Image 4" /></a>
<img src="jqueryslideshow/ssopa_5.jpg" alt="Slideshow Image 5" /></a>
< /div>


here is the header:
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.cycle.all.js"></script>
<style type="text/css">
.pics { height: 382px; width: 557px; padding:0; margin:0; overflow: hidden }
.pics img { height: 350px; width: 525px; padding: 15px; border: 1px solid #ccc; background-color: #eee; top:0; left:0 }
.pics img {
-moz-border-radius: 10px; -webkit-border-radius: 10px;
</style>
<script type="text/javascript">
$('#slideshow').cycle({
fx: 'fade',
timeout: 2000,
speed: 2000,
autostop: 1,
});
</script>
User 2592917 Photo


Registered User
8 posts

I just downloaded the jquery cycle files from your website. I'll try that, I was using the jquery fading page. This might fix it.
User 2147626 Photo


Ambassador
2,958 posts

Also make sure NOT to use spaces in your directory and/or filenames! Very important!! A lot of folks have trouble because some servers and browsers treat spaces differently. Best to eliminate them altogether. :cool:
Graphics for the web, email, blogs and more!
-------------------------------------
https://sadduck.com

Have something to add? We’d love to hear it!
You must have an account to participate. Please Sign In Here, then join the conversation.