hjælp til at få links til at virke på banneret


#1:     miss_fc 03/02 - 2013 22:26
Jeg sidder og er næsten færdig med min nye hjemmeside, men så render jeg selvfølgelig ind i et problem.

Øverst på min hjemmeside har jeg et banner som skifter mellem 4 billeder. Sammen med disse 4 billeder er der til hvert billeder en lille kasse med en tekst.
Man kan klikke disse 4 tekstbokse, og derved styre hvilket billede der bliver vist i banneret. Dvs. Klikker man "Nyt" så kommer billedet der hører til nyt op i banneret. Klikket man på "Hvalpekuld" så skifter banneret til billedet der hører til "hvalpekuld". Derudover skifter banneret automatisk med et bestemt interval mellem de 4 billeder.

MEN jeg kunne godt tænke mig at når man klikker på f.eks. "nyt", så bliver man derigeret videre til Nyhedssiden på min hjemmeside, eller klikker man "hvalpekuld" så bliver man linket til den side omkring hvalpekuld.

Men jeg kan bare ikke få de links til at virke...
jeg tror der er noget i mit css dokument der ligesom blokerer mig for at kunne linke til en ny side... men kan bare ikke finde ud af hvor fejlen ligger.

Nogen som kan hjælpe???

Her er koderne for index-siden hvor slider (banneret) er:

<div class="slider-wrapper">
						<div class="slider">
							<ul class="items">
								<li>
									<img src="images/slider-img5.jpg" alt="" />
								</li>
								<li>
									<img src="images/slider-img6.jpg" alt="" />
								</li>
								<li>
									<img src="images/slider-img4.jpg" alt="" />
								</li>
								<li>
									<img src="images/slider-img7.jpg" alt="" />
								</li>
							</ul>
						</div>
						<ul class="pagination">
							<li><a href="hvalpekuld.html">Hvalpeplaner</a></li>
							<li><a href="nyheder.html">Nyheder</a></li>
							<li><a href="foerhvalp.html">Før du køber hvalp</a></li>
							<li><a href="almunia.html">Min tæve Almunia</a></li>
						</ul>
					</div>	
 


Og her er de afsnit fra CSS dokumentet der er relevante for slider-wrapperen (banneret) og de 4 kasser der udgør "Pagination":


/***** slider *****/
.slider-wrapper {
	width:940px;
	height:450px;
	padding:10px;
	margin-bottom:20px;
	background:#ffffdf;
	overflow:hidden;
	position:relative;
	z-index:1;
}
.slider {
	position:relative;
	width:940px;
	height:450px;
}
.items {display:none;}

.pagination {
	position:absolute;
	left:10px;
	bottom:10px;
	z-index:99;
}
	.pagination li {
		float:left; 
		background:url(../images/pagination-b.png) left bottom repeat-x #000;
	}
		.pagination a {
			display:block;
			width:235px;
			height:66px;
			text-align:center;
			font-family: 'PT Sans', sans-serif;
			font-size:23px;
			line-height:66px;
			color:#ffffdf;
			background:url(../images/pagination-spacer.gif) left top no-repeat;
			text-decoration:none;
		}
		.pagination li:first-child a {background:none;}
		.pagination .current,
		.pagination li:hover {background-position:left top; background-color:#f1c658;}
		.pagination .current a {cursor:default;}









Hilsen

Karina

Redigeret: 04/02 - 2013 16:15

#2:     Webmaster 04/02 - 2013 16:14
Hej Karina

Det er svært at sige uden jeg kender den javascript kode som også må høre til slideshovet, men jeg tror der en gal med html koden, prøv dette istedet:

<div class="slider-wrapper">
<div class="slider">
<ul class="items">
<li>
<a href="hvalpekuld.html"><img src="images/slider-img5.jpg" alt="" /></a>
</li>
<li>
<a href="nyheder.html"><img src="images/slider-img6.jpg" alt="" /></a>
</li>
<li>
<a href="foerhvalp.html"><img src="images/slider-img4.jpg" alt="" /></a>
</li>
<li>
<a href="almunia.html"><img src="images/slider-img7.jpg" alt="" /></a>
</li>
</ul>
</div>
<ul class="pagination">
</ul>
</div>	  


Håber det hjælper, eller må du lige skrive igen :)

Mvh Andreas

#3:     miss_fc 04/02 - 2013 20:42
Det har jeg desværre også prøvet det du foreslår, nemlig at linke til billederne i banneret, og ikke kun skriften i de fire kasser.

Dette er demoen for det layout jeg har hentet, redigeret og gjort til mit eget:
http://demo.html5xcss3.com/demo.php?cat=html5themes&host=templatesmonster&temp=beatycenter

Og det eneste der sker er ligesom det på demoen, man kan klikke på én af de fire bokse oppe i banneret, men det eneste der sker er at billedet skifter i banneret, man bliver ikke linket videre til en anden side.

Jeg prøvede de koder du foreslog her Andreas, men man kan ikke klikke på billedet selvom jeg vedhæfter et link på dem. :(

Jeg forstår simpelt hen ikke hvorfor linksene ikke virker.

#4:     Webmaster 04/02 - 2013 21:34
Det virker også lidt mærkeligt at de link skal føre hen til sider da er som et slideshow. Så tror jeg det ville være bedre sådan, at når man klikker på billederne sendes man hen til siden, men linket nedenunder bare er for at vise billedet.

Prøv dette styk html i stedet, det virker som jeg lige har skrevet.

<div class="slider">
<ul class="items">
<li>
<a href="hvalpekuld.html"><img src="images/slider-img5.jpg" alt="" /></a>
</li>
<li>
<a href="nyheder.html"><img src="images/slider-img6.jpg" alt="" /></a>
</li>
<li>
<a href="foerhvalp.html"><img src="images/slider-img4.jpg" alt="" /></a>
</li>
<li>
<a href="almunia.html"><img src="images/slider-img7.jpg" alt="" /></a>
</li>
</ul>
</div>
<ul class="pagination">
<li>Hvalpeplaner</li>
<li>Nyheder</li>
<li>Før du køber hvalp</li>
<li>Min tæve Almunia</li>
</ul>
</div> 


#5:     miss_fc 04/02 - 2013 21:54
det virker stadig ikke når jeg sætter koderne ind på min index side. Jeg tror der må være noget et andet sted i mine koder som gør den ikke vil linke.

Jeg sætter de links ind du skriver til hvert billede, men jeg kan stadig ikke klikke på billedet. Det burde virke. Det ved jeg. Men det gør det bare ikke.
Det frustrerer mig, for har jo linket en million gange før, uden nogen problemer, og pludselig vil den bare ikeke.

Jeg ligger lige de koder ind for index-siden som er der før banneret... måske et trænet øje kan se noget jeg ikke kan se, som der gør jeg ikke kan sætte et link til billederne i banneret.

Jeg undskylder på forhånd den wall og text der kommer nu, men måske der er noget?


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
  <html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title></title>
<meta charset="utf-8">
<link rel="stylesheet" href="css/reset.css" type="text/css" media="screen">
<link rel="stylesheet" href="css/style.css" type="text/css" media="screen">
<link rel="stylesheet" href="css/grid.css" type="text/css" media="screen">
<link href='http://fonts.googleapis.com/css?family=PT+Sans' rel='stylesheet' type='text/css'>  
<script src="js/jquery-1.6.3.min.js" type="text/javascript"></script>
<script src="js/cufon-yui.js" type="text/javascript"></script>
<script src="js/cufon-replace.js" type="text/javascript"></script>
<script src="js/PT_Sans_400.font.js" type="text/javascript"></script>
<script src="js/PT_Sans_italic_400.font.js" type="text/javascript"></script>
<script src="js/Satisfy_400.font.js" type="text/javascript"></script>
<script src="js/NewsGoth_400.font.js" type="text/javascript"></script>
<script src="js/FF-cash.js" type="text/javascript"></script>
<script src="js/script.js" type="text/javascript"></script>  
<script src="js/tms-0.3.js" type="text/javascript"></script>
<script src="js/tms_presets.js" type="text/javascript"></script>
<script src="js/jquery.easing.1.3.js" type="text/javascript"></script>
<script src="js/easyTooltip.js" type="text/javascript"></script>


</div>

<!--[if lt IE 9]>
  <script type="text/javascript" src="js/html5.js"></script>
<![endif]-->
</head>
<body id="page1">
<div class="extra">
<!--==============================header=================================-->
<header>
<div class="menu-row">
<div class="main">
<div class="container_12">
<div class="grid_12">
<nav class="fleft">
<ul class="services-menu">


</ul>
</nav>
<nav class="fright">
<ul class="main-menu">
<li class="active"><a href="index.html">Forside</a></li>
<li><a href="ommig.html">Om mig</a></li>
<li><a href="minehunde.html">Mine hunde</a></li>
<li><a href="hvalpekuld.html">Hvalpekuld</a></li>
<li><a href="galleri.html">Galleri</a></li>
<li><a href="nyttiginfo.html">Nyttig info</a></li>
<li><a href="kontakt.html">Kontakt</a></li>



</ul>
</nav>
<div class="clear"></div>
</div>
<div class="clear"></div>
</div>
</div>
</div>
<div class="header-row"><div class="ic"></div>
<div class="main">


<h1>
<a href="index.html">Joy de Vie</a>

</h1>

<div class="slider-wrapper">
<div class="slider">
<ul class="items">
<li>
<img src="images/slider-img5.jpg" alt="" />
</li>
<li>
<img src="images/slider-img6.jpg" alt="" />
</li>
<li>
<img src="images/slider-img4.jpg" alt="" />
</li>
<li>
<img src="images/slider-img7.jpg" alt="" />
</li>
</ul>
</div>
<ul class="pagination">
<li><a href="hvalpekuld.html">Hvalpeplaner</a></li>
<li><a href="nyheder.html">Nyheder</a></li>
<li><a href="foerhvalp.html">Før du køber hvalp</a></li>
<li><a href="almunia.html">Min tæve Almunia</a></li>
</ul>
</div>  





<div class="container_12">
<div class="wrapper">
<article class="grid_4">
<h4>DKK, fci og Cavalierklubben</h4>
Joy de Vie opdrætter gennem Dansk Kennel Klub, og hvalpene vil derfor få stamtavle herfra.
Dansk Kennel Klub er den eneste stamtavleklub under den internationale organisation fci.
Derudover er jeg medlem af Cavalierklubben i Danmark.
</article>
<article class="grid_4">
<div class="indent-left">
<h4>Uddannelse og fci kennelnavn</h4>
Jeg har i 2012 gennemgået Dansk Kennel Klubs opdrætteruddannelse!<br>
Derfor er det nu muligt for mig at ansøge om officielt kennelmærke med mit eget kennelnavn.
Dette har jeg ansøgt om, og venter nu på godkendelse fra fci, for herefter at skulle have kennel-kontrol-besøg af DKK.

</div>
</article>
<article class="grid_4">
<div class="indent-left2">
<h4>Joy de Vie og Facebook</h4>
Kennel Joy de vie har en profil på Facebook, og alle er velkomne til at søge venskab eller abonnere på profilen.
Du kan finde profilen under navnet "Kennel Joy de Vie (Karina Angela Jensen)" eller ved at klikke Facebook ikonet:
<a href="http://www.facebook.com/kennel.joydevie" title="Joy de Vie - Facebook" target="JoydeviepaFacebook"><img src="images/facebook.png" border="0" alt=""></a>

</div>
</article>

</div>
</div>  
</div>
</div>

</header>

#6:     miss_fc 04/02 - 2013 22:11
hov... jeg fandt lige disse koder nede i bunden af alle siderne lige efter Footer, der er nævnt noget med slider, kan det være noget der laver rav i den?

<script type="text/javascript"> Cufon.now(); </script>
<script type="text/javascript">
$(window).load(function() {
$('.slider')._TMS({
duration:800,
easing:'easeOutQuad',
preset:'simpleFade',
slideshow:7000,
banners:false,
pauseOnHover:true,
pagination:'.pagination',
pagNums:false
});
});
</script>
</body>
</html>





Er ved at blive sindsyg af den lille ting. Nu er jeg stort set færdig med hele hjemmesiden, har arbejdet i måneder på det, og så kan jeg ikke få de &%¤#"!?& links til at virke.
Og desværre kan jeg ikke bare droppe det, da jeg har valgt ikke at have alle sider oppe i menuen, fordi besøgende så kunne klikke sig over til dem via banneret.
Så jeg kan ikke engang skyde hjemmesiden i vejret, da det er en vigtig ting jeg SKAL have på plads først.

#7:     miss_fc 04/02 - 2013 22:50
jeg har uploadet min index-side...
måske det hjælper at se den.
www.kennel-joydevie.dk


det er kun index-siden jeg har uploadet.

#8:     Webmaster 04/02 - 2013 23:01
Hej,

På den du har uploadet har du ikke sat et link rundt om billedet som der var i den kode jeg gav dig.

Mvh Andreas

#9:     Webmaster 04/02 - 2013 23:04
Forresten, hvis du skal bruge professionel hjælp, hvor jeg f.eks. laver hele siden for dig, kan jeg også tilbyde det.

Se evt et par af mine referencer på http://lightdale.dk

Mvh Andreas

#10:     miss_fc 05/02 - 2013 0:34
jeg afprøvede de koder du skrev herinde, men det virker ikke.
Man kan ikke klikke på billederne, heller ikke efter jeg har sat koderne ind.

Og "menu baren" under billedet forsvinder og bliver til almindelig skrift når jeg sætter de koder ind du har skrevet her.

Så det er desværre ikke løsningen.

Det kan godt være jeg ender med at skulle bruge professionel hjælp til det med netop banneret.
Men intet andet. For jeg er færdig med hjemmesiden ud over det, og jeg er mere end ovenud tilfreds med resultatet.

Men at give en skilling for at få banneret til at du som jeg gerne vil, det vil jeg gerne. Afhængig af prisen naturligvis.

#11:     Webmaster 05/02 - 2013 18:21
Hvis det bare er slideshowet hjælper jeg dig bare :)

Prøv at skiftet det stykke javascript du har bunden af siden ud med dette:

<script type="text/javascript">
$(window).load(function() {
$('.slider')._TMS({
duration:800,
easing:'easeOutQuad',
preset:'simpleFade',
slideshow:7000,
banners:false,
pauseOnHover:true,
changeEv:'hidden',
pagination:'.pagination',
pagNums:false
});
});
</script>


#12:     miss_fc 05/02 - 2013 20:05
Hold da op et chok jeg fik da jeg klikkede på banneret, og jeg så blev sendt videre til den side jeg skulle!!!

DET VIRKEDE!!!!

Jeg ved slet ikke hvordan jeg skal takke dig Andreas!

Tusinde, millioner gange tak!!

Når jeg skyder siden i vejret imorgen aften, så laver jeg en tak til dig ude i Breaking News på forsiden, og linker til din side.
Mange tak!!!

#13:     Webmaster 06/02 - 2013 9:00
Det var så lidt, jeg er glad for at det virkede.

Et link til min side, som du selv skriver ville være helt i top. :)

Mvh Andreas

Skriv et svar

Klik for at indsætte: Fed | Kursiv | Link | Billede | Citat | Liste | Kode

Abbonner

Nå du skriver et nyt svar kommer du automatik til at abbonnere på nye svar. Hvis du ikke vil det, skal du fjerne krydset i boksen ovenover.