Jump to content
Stef's Coding Community
NuCoder

Image Fade

Recommended Posts

I am attempting to fade 3 images and when I test in IE, FF, Opera, Safari - the images are not fading. Any idea what I am overlooking or missing?

 

The CSS

 

#slideShow .fadeIn {

position: relative;

width: 790px;

height: 280px;

}

 

#slideShow .fadeIn img {

position: absolute;

left: 0;

top: 0;

 

jQuery

 

 

marina main

marina high and dry

marina overhead

 

$(function(){

$('.fadein img:gt(0)').hide();

setInterval(function(){

$('.fadein :first-child').fadeOut()

.next('img').fadeIn()

.end().appendTo('.fadein');},

3000);

});

 

Share this post


Link to post
Share on other sites

I am still unable to fade the images and do not know why. I copied this script from Jonathan Snook (simplest jQuery Slide Show). When I test browser in IE and FF - the images are not fading. I am not getting any error messages. Where am I going wrong?

 

thank you in advance

 

Brian

 

 

In the head section

 

 

CSS

.fadeIn {

position:relative;

width:790px;

height:300px;

margin-bottom: 40px;

}

 

.fadeIn img {

position:absolute;

left:0;

top:0;

border: 5px solid #c9c9c9;

}

 

 

jQuery

$(function(){

$('.fadeIn img:gt(0)').hide();

setInterval(function(){

$('.fadeIn :first-child').fadeOut()

.next('img').fadeIn()

.end().appendTo('.fadeIn');},

3000);

});

wetslips.jpg

high and dry

Share this post


Link to post
Share on other sites

I'm not familiar with the problems but it seems like to me you are missing a file path for this:

 

 

Is there a script file it needs to link to??

Share this post


Link to post
Share on other sites

 

 

 

 

$(function(){

$('.fadeIn img:gt(0)').hide();

setInterval(function(){

$('.fadeIn :first-child').fadeOut()

.next('img').fadeIn()

.end().appendTo('.fadeIn');},

3000);

});

wetslips.jpg

high and dry

 

 

open 7 days

 

 

leftColumn border

 

Word from our boaters..

"I have been coming to Anclote Harbors for 12 years. Service, price and reliability sum up the Marina in 3 words. I could not imagine going anywhere else"

From Brian Jones

 

sideBar lower border

 

marina overhead

 

Our Hours:

Monday thru Friday:           8:00 - 5:00

Saturday & Sunday:            8:00 - 7:00

 

 

 

mission logo

Welcome to Anclote Harbors Marina

"We are dedicated to providing great service at competitive rates!"

Anclote Harbors has been in the marine industry 20 plus years. We are now an All New High and Dry facility offering the boating community a new look and great services! Not only are we the only local marina that is 20% less than the industry standard, but we also are the only marina with mastered techinicans available 7 days a week. Call us today, & we will have your boat ready for launch when you arrive. No need to rush coming back to land - we have you covered with our beautiful

wetslips, which include cable tv, free wireless internet and a guaranteed depth of atleast 5.5 ft. Come see for yourself the difference at Anclote Harbors

Marina - where boating is a pleasure!

 

Our Services

High &amp Dry Buildings

Wet Slips

24 Hr. Security Cameras

Floating Docks

Flushing Of Boat

And more..

 

 

News & Tips

Anchoring Tips

When purchasing a new anchor, make sure you get the correct type for the bottom conditions where you go boating. Most stores can help you decide on the type, but do not go cheap. Buy at least 1 good heavy anchor for each bottom which you expect to have to anchor on.

 

promo ad

 

 

 

 

footer top border

Anclote Harbors Marina

523 Anclote Rd.

Tarpon Springs, Fl 34689

(727) 934-7616

info@ancloteharbors.com

 

 

Home

About

Services

Ammenities

Maintenance

Contact

 

footer logo

 

©2010 Anclote Harbors Marina - All Rights Reserved

 

 

 

Share this post


Link to post
Share on other sites

Again, I don't see a script reference a javascript file.

 

Anclote Harbors Marina

 

or there are suppose to be some javascript between the script tags but are not appearing on this forum because of the comment tags??

 

If a .js file is required then it should be something like this:

 

Share this post


Link to post
Share on other sites

$(function(){

$('.fadeIn img:gt(0)').hide();

setInterval(function(){

$('.fadeIn :first-child').fadeOut()

.next('img').fadeIn()

.end().appendTo('.fadeIn');},

3000);

});

 

I think I am making the error bc I am not putting this into the head section. I was adding this in the xhtml(?)

Share this post


Link to post
Share on other sites

If a

 

So you CANNOT do the following:

 

$(function(){

//jQuery Script;

});

 

This is WRONG it's never gonna work.

 

You HAVE to do it like the following (You can see above that I corrected your mistake but you still didn't correct your code) :

Edited by BeeDev

Share this post


Link to post
Share on other sites
If a

 

This is WRONG it's never gonna work.

 

You HAVE to do it like the following (You can see above that I corrected your mistake but you still didn't correct your code) :

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...

×
×
  • Create New...