Ultimate Fade In Slideshow image - logo in front

**jonnyfreak** · 06-04-2013, 08:28 PM

i am using the Ultimate Fade In Slideshow

http://www.dynamicdrive.com/dynamici...nslideshow.htm

i have a logo that i want to have in front of the slideshow images but am having trouble. I have tried numerous things but cant have the image on top of slideshow.

the way i have it set up is as follows

HTML Code:

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>

<script type="text/javascript" src="js/fadeslideshow.js">

/***********************************************
* Ultimate Fade In Slideshow v2.0- (c) Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for this script and 100s more
***********************************************/

</script>

<script type="text/javascript">

var mygallery=new fadeSlideShow({
	wrapperid: "fadeshow1", //ID of blank DIV on page to house Slideshow
	dimensions: [1000, 300], //width/height of gallery in pixels. Should reflect dimensions of largest image
	imagearray: [
		["../images/slideshow/1.jpg", "", "", ""],
		["../images/slideshow/2.jpg", "", "", ""],
		["../images/slideshow/3.jpg"],
		["../images/slideshow/4.jpg"],
		["../images/slideshow/5.jpg"],
		["../images/slideshow/6.jpg"],
		["../images/slideshow/7.jpg", "", "", ""] //<--no trailing comma after very last image element!
	],
	displaymode: {type:'auto', pause:2500, cycles:0, wraparound:false},
	persist: false, //remember last viewed slide and recall within same session?
	fadeduration: 500, //transition duration (milliseconds)
	descreveal: "ondemand",
	togglerid: ""
})

</script>
<style type="text/css">
body {
	margin-left: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	background-repeat: repeat;
}
#fadeshow1 {
	background-image: url(../images/LOGO21.gif);
}
#apDiv1 {
	position:absolute;
	left:0px;
	top:0px;
	width:825px;
	height:167px;
	z-index:1;
}
#apDiv1 {
}
</style>
</head>

<body>
<div id="fadeshow1"></div>
<div id="fadeshow2toggler" style="width:1000px; text-align:center; margin-top:10px">
<span class="status" style="margin:0 50px; font-weight:bold"></span>
</div>
</body>
</html>

as i say i have a logo that i trued to place in <div id="fadeshow1"></div> but obviously that will be covered by the slideshow images. I want to be able to place the logo in front of the slideshow images

thanks in advance

**Beverleyh** · 06-04-2013, 09:05 PM

What if you try setting the following css on a separate logo div;

Code:

<div id="logo"></div>

Code:

#logo {
background-image:url(path/to/logo.gif);
position:absolute;
z-index:9999;
top:0px;
left:0px;
width:100px;
height:100px;
}

Change the top, left, width and height px values to suit.

**jonnyfreak** · 06-04-2013, 09:32 PM

Originally Posted by Beverleyh

What if you try setting the following css on a separate logo div;

Code:

<div id="logo"></div>

Code:

#logo {
background-image:url(path/to/logo.gif);
position:absolute;
z-index:9999;
top:0px;
left:0px;
width:100px;
height:100px;
}

Change the top, left, width and height px values to suit.

brilliant. thanks so much, need to do a lot more work with CSS. thanks again

Thread: Ultimate Fade In Slideshow image - logo in front

Thread Tools

Search Thread

Ultimate Fade In Slideshow image - logo in front

The Following User Says Thank You to Beverleyh For This Useful Post:

Similar Threads

Ultimate Fade-in slideshow - STOP FADE IN ON FIRST IMAGE

Ultimate Fade-in slideshow - Is in front of drop down menu

Ultimate Fade-in slideshow (v2.1) - 1st image no fade in

Ultimate Fade in Slideshow - how to require FIRST image to fade in?

3-image Ultimate Fade In Slideshow possible?

Bookmarks

Bookmarks

Posting Permissions