Please can someone help me out with this code

Question

0.00/5 (No votes)

See more:

Hi everyone

i have been stuck on making my slideshow work on my website for a while now and hoping you experts can point me in the right direction? I am a noob when it comes to HTML, Java etc etc. So please be nice here is my code: So basically it works locally but once uploaded to my web server via ftp it doesn't? your help is much appreciated thanks!

C#

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
<link href="CSS/style_tut.css" rel="stylesheet" type="text/css">

<style type="text/css">
#slider{
height:450px;
width:650px;
margin: 20px auto;
position:relative;
}
#img{
height:450px;
width:650px;
position:absolute;
}
#left_holder{
height:450px;
width:100px;
position:absolute; 
left:0px;
top:0px;
}
#right_holder{
height:450px;
width:100px;
position:absolute;
right:0px;
top:0px;
}
.left{
height:50px;
width:50px;
position:absolute;
top:40%;
left:0px;
}
.right{
height:50px;
width:50px;
position:absolute;
top:40%;
left:50px;
}
</style>

<script src="js/alert_tut.js">
var imagecount = 1;
var total = 5;

function slide(x) {
var Image = document.getElementById('img');
imagecount = imagecount + x;
if(imagecount > total){ imagecount = 1;}
if(imagecount < 1){ imagecount = total;}
Image.src = "images/img"+ imagecount +".jpg";
}
window.setInterval(function slideA() {
var Image = document.getElementById('img');
imagecount = imagecount + 1;
if(imagecount > total){ imagecount = 1;}
if(imagecount < 1){ imagecount = total;}
Image.src = "images/img"+ imagecount +".jpg";
},5000);

</script> 

</head>

<body onLoad="slideA()">
<div id="slider">
<img src="images/img1.jpg" id="image" >
<div class="left_hold"><img ></div>
<div class="right_hold"><img ></div>
</div>

</body>
</html>

Posted 30-Jan-15 1:24am

Member 11414568

Updated 30-Jan-15 2:36am

Thanks7872

v2

Add a Solution

Comments

Sinisa Hajnal 30-Jan-15 7:37am

Please remove unnecessary code and use "code" button to format and highlight your code . Ensure that all files are copied on the server and that relative paths are the same.

ZurdoDev 30-Jan-15 7:45am

If it works locally but no on the server then Anthony in Solution 1 may be right in that you are missing something. Something did not get uploaded.

But what would help more is to explain what does not work.

Member 11414568 30-Jan-15 8:52am

sorry forgot to mention. So it is a image slide show with 6 images and only image one works and the rest show "404 error" and Uncaught ReferenceError: slideA is not defined? So i was thinking it maybe a file missing but not sure am I allow to post my URL here? Thanks

Member 11414568 30-Jan-15 8:53am

I have double checked all file locations and everything seems to be where it should
Thanks for your quick replies

ZurdoDev 30-Jan-15 8:58am

404 as you know means it cannot be found.

Member 11414568 30-Jan-15 9:06am

Thanks for the reply RyanDev. Yes I know 404 means file cannot be found and thats where my main problem lies at the moment as I have re-uploading all image files and double checked file names and all seems correct but not able to determine if the fault now lies in the coding or server fault my url is www.defiximports.com if you dont mind having a look? Thanks

ZurdoDev 30-Jan-15 9:10am

I found the problem. I'll post a solution.

Member 11414568 30-Jan-15 9:13am

Thanks RyanDev much appreciated!

Member 11414568 30-Jan-15 9:48am

Hi RyanDev. Thanks for the quick reply. had a fiddle and I am still lost? Do you mean change the image file destination folder on my web server to "images"? or change the remaining "Images" to "images" on the above coding? Thank you for the help. I can't access google dev tools here "sigh"

ZurdoDev 30-Jan-15 9:50am

Change Images, with a capital I to images with a lower case i. Your webserver is case sensitive.

2 solutions

Solution 3

Thanks to RyanDev for pointing me in the right direction! It came down to the alert_tut.js file needing "Images" changed to "images" and images being cache so what i did was clear the cache re-uploaded files and everything is working now thanks to RyanDev once again.

Posted 30-Jan-15 14:16pm

Member 11414568

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

ZurdoDev · Accepted Answer · 2015-01-30T03:12:00

You have a very picky webserver. The folder structure is case sensitive. When inspecting the element in google dev tools I could see that the first one was images/img1.jpg and the next images were loaded as Images/imgx.jpg.

So, this url is valid, http://www.defiximports.com/images/img2.jpg[^]

but this one is not

http://www.defiximports.com/Images/img2.jpg[^]

Silly webserver. I don't think IIS is case sensitive and that is pretty annoying, IMO. Not sure what you're hosting on.

So, just change your links to images instead of Images.