• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Nivo-Slices verschieben sich nach unten

  • Ersteller Ersteller Gelöschtes Mitglied 23527
  • Erstellt am Erstellt am
G

Gelöschtes Mitglied 23527

Guest
Hallo Forum,

ich habe nun den Nivo Slider in meine Homepage eingebaut jedoch scheint der nicht richtig zu funktionieren.
Für die Wechsel teilt das Script das Bild in verschiedene "Scheiben" auf, durch CSS Fehler (höchstwahrscheinlich meinerseits) verschieben sich die Stücke nach unten und ziehen die Seite in die Länge. Ich hoffe ihr könnt mir helfen.

Hier ist meine Seite: http://toegraphics.de/relaunch/

Ich poste den Quellcode aber hier auch nochmal rein:

Nivo Div befindet sich im #wrapper:

Code:
<div id="slider" class="nivoSlider">    	<img src="nivo_images/rot.png" alt="" />
    	<img src="nivo_images/gelb.png" alt="" />
    	<img src="nivo_images/gruen.png" alt="" />
	</div>

#wrapper

Code:
body {    font-family: maven_pro;
	font-size: 16px; line-height: 18px;	color: #ffffff; text-align: center; text-shadow: 0px 1px 0px #000;
	background: #e0e0e0 url(images/bg.png) repeat top;
}


#wrapper {
		width: 700px;
		margin: 0 auto;
		padding-top: 277px;
		background: url(images/glow.png) top center no-repeat;
		z-index: 1;
}

Nivo-CSS

Code:
/* The Nivo Slider styles */.nivoSlider {
	position:relative;
}
.nivoSlider img {
	position:absolute;
	top:0px;
	left:0px;
}
/* If an image is wrapped in a link */
.nivoSlider a.nivo-imageLink {
	position:absolute;
	top:0px;
	left:0px;
	width:auto;
	height:auto;
	border:0;
	padding:0;
	margin:0;
	z-index:6;
	display:none;
}
/* The slices and boxes in the Slider */
.nivo-slice {
	display:block;
	position:absolute;
	z-index:5;
	height:auto;
	width: auto;
	left: auto;
}
.nivo-box {
	display:block;
	position:absolute;
	z-index:5;
}
/* Caption styles */
.nivo-caption {
	position:absolute;
	left:0px;
	bottom:0px;
	background:#000;
	color:#fff;
	opacity:0.8; /* Overridden by captionOpacity setting */
	width:100%;
	z-index:8;
}
.nivo-caption p {
	padding:5px;
	margin:0;
}
.nivo-caption a {
	display:inline !important;
}
.nivo-html-caption {
    display:none;
}
/* Direction nav styles (e.g. Next & Prev) */
.nivo-directionNav a {
	position:absolute;
	top:45%;
	z-index:9;
	cursor:pointer;
}
.nivo-prevNav {
	left:0px;
}
.nivo-nextNav {
	right:0px;
}
/* Control nav styles (e.g. 1,2,3...) */
.nivo-controlNav a {
	position:relative;
	z-index:9;
	cursor:pointer;
}
.nivo-controlNav a.active {
	font-weight:bold;
}

Ich hoffe ihr könnt mir helfen. Danke!!
 
Zurück
Oben