If this is your first visit, be sure to
check out the FAQ by clicking the
link above. You may have to register
before you can post: click the register link above to proceed. To start viewing messages,
select the forum that you want to visit from the selection below.

Enjoy an ad free experience by logging in. Not a member yet? Register.

Trouble getting slider code to work with HTML and CSS on Website

Hello folks,

Totally new to this, and trying to make something entirely new work. I have been working on code from menucool for a rotating banner. I have it working on a dummy page, but when I move the code to the destination page, it no longer works. I have tried to find the issue but have reached the point where I do not know what to do next. Hoping you all can help.

The code is made up of three different components, one HTML, one CSS, and one JavaScript. I am posting each to this forum as I currently have them...please be kind, this is a first for me!

I am trying to put the code on my home page. When I place it there, instead of rotating 4 images through, it displays all four images stacked. Home page is at http://www.gardendesignexposed.com...it currently does NOT have the code placed on it.

Have you got a live working example we can see? First thing I'd look at is the "Console" tab in your browser inspector (F12 on chrome or IE) if your using Firefox then install "Firebug" - this is a useful way of seeing if there are any JS errors when you view the page.

I'd check the source and ensure your Javascript file is linked in the <head> correctly so the code can execute.

Here is what I ended up with on the published page (index) that does not work.

HTML1524: Invalid DOCTYPE. The shortest valid doctype is "<!DOCTYPE html>".
index.html, line 1 character 1
HTML1509: Unmatched end tag.
index.html, line 108 character 447
HTML1422: Malformed start tag. A self closing slash should be followed by a U+003E GREATER-THAN SIGN (>).
index.html, line 251 character 17
HTML1421: Malformed end tag. End tags should not contain attributes.
index.html, line 251 character 17
HTML1512: Unmatched end tag.
index.html, line 251 character 15
SEC7115: :visited and :link styles can only differ by color. Some styles were not applied to :visited.
index.html

I have corrected the code (removed it) from my index page as I do not want it on the website unworking.

Hopefully you can access the page and see it for yourself. Just what you have already shown me tells me where the problem lies, but I would not know how to fix it...so I am glad you are along for the ride!

Having just looked at index.html - the HTML code is not actually in the source for the javascript slider. When I viewed the source for the header it's a background image on the .Liner div and I see no record of "slider" being in the HTML - which is the div you've targeted as the slider.

If you can try and put the code on the homepage then I can snoop around and see exactly why it's not working - makes a bit easier if I see the not working product live on a site that I can debug without guessing what may be causing the errors.

I can do that. I will have to wait until after work today though...I have a day job! Darn it.

I come home around 3:30 to 4 Pacific Time..not sure what that translates to where you are...about a 9 hour difference I think. If I put the code up right after I come home today, would that be a time that would work for you to duck in and see what is going on?

If not, please let me know what is a good time. The nature of the failure is such that I do not want the non-working code out on the site for a long period of time.