colonelblue
asked on
How do I add a div ( so that I may add a static menu) over this Javascript rotating images script?
Hello Experts,
I found this nifty little code for a Javascript rotating images.
The idea was to have the background images change images ( using the script above ) while a static div holding text and links remain over the changing images.
The thing is whatever div I try to place over the rotating images, the div with text disappears and then reappears while the images change.
I don't mind using another approach at all for reaching the same result where the background images rotate whether on a div or a cell and static links remain over them.
I attached the css, js and images files if needed,
Thank you in advance.
Sample index page
style.css
images.zip
I found this nifty little code for a Javascript rotating images.
The idea was to have the background images change images ( using the script above ) while a static div holding text and links remain over the changing images.
The thing is whatever div I try to place over the rotating images, the div with text disappears and then reappears while the images change.
I don't mind using another approach at all for reaching the same result where the background images rotate whether on a div or a cell and static links remain over them.
I attached the css, js and images files if needed,
Thank you in advance.
Sample index page
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Infinite Rotating Images Using jQuery (JavaScript)</title>
<script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js?ver=3.0.1'></script>
<script type='text/javascript' src='js/infinite-rotator.js'></script>
<link rel="stylesheet" href="css/style.css" type="text/css" media="screen" />
</head>
<body>
<h1>Infinite Rotating Images Using jQuery (JavaScript)</h1>
<!-- START: Rotating Images -->
<div id="rotating-item-wrapper">
<img src="images/greenpeople.jpg" alt="a person entering a building" class="rotating-item" width="980" height="347" />
<img src="images/entrance.jpg" alt="photo of building across from our office" class="rotating-item" width="980" height="347" />
<img src="images/bluepeople.jpg" alt="building entrance with neon backlit walls" class="rotating-item" width="980" height="347" />
<img src="images/reflection3.jpg" alt="building lobby window reflections" class="rotating-item" width="980" height="347" />
<img src="images/reflection2.jpg" alt="reflection on building windows" class="rotating-item" width="980" height="347" />
<img src="images/manequine.jpg" alt="two manequines in window" class="rotating-item" width="980" height="347" />
<p style="display:none;">Source code and instructions at: <a href="http://trendmedia.com/news/infinite-rotating-images-using-jquery-javascript/">Infinite Loop: Rotating Images Using jQuery (JavaScript)</a><br/>by <a href="http://trendmedia.com/">San Francisco WordPress website designers and developers - TrendMedia</a></p>
</div>
<!-- END: Rotating images images -->
</body>
</html>
infinite-rotator.jsstyle.css
images.zip
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
Thank you Gary!
Virtual Duff Keg. :)
Virtual Duff Keg. :)
Cd&