Avatar billede miss_fc Nybegynder
03. februar 2013 - 22:19 Der er 23 kommentarer og
1 løsning

Hvordan får jeg linksene til at virke??

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
Avatar billede olebole Juniormester
03. februar 2013 - 22:35 #1
<ole>

Prøv at lægge et link til siden

/mvh
</bole>
Avatar billede miss_fc Nybegynder
03. februar 2013 - 22:49 #2
Det kan jeg ikke, da det nye design ikke er i luften, så at sige.
Jeg arbejder med den på computeren.

Men dette er linket til selve designet som jeg har brugt:
http://demo.html5xcss3.com/demo.php?cat=html5themes&host=templatesmonster&temp=beatycenter

Håber det er en hjælp.
Avatar billede olebole Juniormester
03. februar 2013 - 23:57 #3
Nej, det virker jo  =)
Avatar billede olebole Juniormester
04. februar 2013 - 00:00 #4
- og det er ikke koden, du viser, der skaber problemer. Den alene virker fint
Avatar billede miss_fc Nybegynder
04. februar 2013 - 00:04 #5
Nej, det virker ikke.

Det jeg vil er, at man skal kunne klikke på f.eks. "Hair" og så skal det linkes til en anden side på hjemmesiden.
Men det eneste der sker er, at den skifter billede. Men man kommer ikke til den side jeg vil linke til. Det er ligesom om der er noget der blokerer for at kunne linke.
Jeg kan i hvert fald ikke få mine links til at virke.


Og jeg synes jo jeg bruger koden til at linke som jeg plejer... men den vil bare ikke at man kan klikke på den og skifte side.
Grrrr.
Avatar billede olebole Juniormester
04. februar 2013 - 15:48 #6
Hehe ... jo, det virker fuldstændig, som det skal. Det er en demo, og linket ser sådan ud:

<a href="#">Hair</a>

I stedet for 'havelågen' skriver du URL'en til den side, du vil linke til
Avatar billede miss_fc Nybegynder
04. februar 2013 - 20:38 #7
ja, det ved jeg jeg er det man skal.

Det har jeg også gjort (se det jeg har kopieret ind i mit start-indlæg). Der er havelågen skiftet ud med "hvalpekuld.html", "nyheder.html" osv... (Jeg har så også ændret navnene i de fire bokse, men det burde jo ikke have betydning. Men det hjælper ikke! Den skifter ikke side!!
Den skifter kun billede.
Avatar billede olebole Juniormester
04. februar 2013 - 21:35 #8
Jeg gentager: Den kode, du viser her, skifter fint side. Har du problemer, skyldes det noget andet, som du ikke viser. Prøv den kode, du har skrevet:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Untitled Document</title>
<style type="text/css">
body {
    margin: 0;
    padding: 0;
    font: 12px verdana, arial, sans-serif;
}
/***** 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;}
</style>
</head>
<body>

<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>     

</body>
</html>
Avatar billede miss_fc Nybegynder
04. februar 2013 - 21:50 #9
Jeg tror du har ret Olebole, at der er noget et andet sted der gør at mine links ikke virker. For som du skriver: koden virker jo.
Den virker bare ikke på mine sider, ergo må der ligge et eller andet problem et eller andet sted.


Jeg prøver lige at kopiere alle de første koder ind, som siden er bygget op med... alt det før selve Content, Footer osv.

Undskylder på forhånd for den lange wall of text, men måske et trænet øje kan se noget jeg ikke kan?


<!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>
Avatar billede miss_fc Nybegynder
04. februar 2013 - 22:10 #10
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.
Avatar billede olebole Juniormester
04. februar 2013 - 22:22 #11
Jeg vil gerne hjælpe, hvis du uploader siden
Avatar billede miss_fc Nybegynder
04. februar 2013 - 22:42 #12
nu har jeg uploadet min index-side... www.kennel-joydevie.dk

Men af en eller anden grund vil den nu heller ikke vise mine banner-billeder.
De andre billeder på index-siden vil den gerne... men ikke banner-billederne.
Det ved jeg ikke hvorfor... det bliver også en ting jeg skal have set på.
Men i hvert fald så er index siden nu uploadet.
Avatar billede miss_fc Nybegynder
04. februar 2013 - 22:48 #13
hov jo, nu er banner-billederne på.
One.com skulle sikkert bare lige have et par minutter. :)
Dejligt at DET virker... nåede lige at tænke: åååh nej. Ikke en forhindring mere. XD
Avatar billede olebole Juniormester
04. februar 2013 - 23:35 #14
Hehe ... de links er slet ikke til at skifte side med, men til at skifte slide med  =)
Avatar billede miss_fc Nybegynder
05. februar 2013 - 00:29 #15
så det er ikke muligt at inkorporere links til enten billede eller helst de fire bokse i banneret?
Avatar billede olebole Juniormester
05. februar 2013 - 01:56 #16
Aner det ikke. Det ser ikke ud til at være noget dokumentation på slideren, og så er det jo lidt bøvlet at arbejde med. Prøv at se, hvad der sker, hvis du skriver:

<div class="slider">
    <ul class="items">
        <li>
            <a href="nyheder.html">LINK</a>
            <img src="images/slider-img5.jpg" border="0" alt="">
        </li>
        ... osv ... osv ... osv ...
Avatar billede olebole Juniormester
05. februar 2013 - 02:08 #17
Nej, det vil heller ikke hjælpe. Jeg skal downloade koden og teste, men det har jeg ikke lyst til  =)
Avatar billede miss_fc Nybegynder
05. februar 2013 - 10:34 #18
jeg tror jeg bliver nødt til i sidste ende så at betale en skilling for at en prof kigger på det og får bygget koder på så man kan linke fra banneret.
Tak fordi du tog dig tid til at kigge på det Olebole.

Det var trælst at det ikke lige sådan er til at fungere.
Avatar billede olebole Juniormester
05. februar 2013 - 18:02 #19
Selvtak. Jeg ved godt, hvad det er, du ønsker. Jeg handler en del på EBay, som på forsiden har netop den type slider, du ønsker.

Nederst i højre hjørne ligger links til de forskellige slides - og de yderligere links, man måtte ønske, kan lægges i hvert slide. Desværre er koden ikke lige til at suge.

Forskellen er, at i EBay's version, bruges selve UL-listen med hele sit indhold.

I den version, du bruger, gemmes selve UL-listen og der oprettes to nye DIV. Der fades kontinuerligt mellem disse to DIV, som skiftevis får tildelt et billede fra listen som baggrundsbillede. Scriptet er således ligeglad med LI-elementernes indhold. Det eneste, scriptet kikker efter (og bruger), er billedet.

Scriptet skal således skrives fundamentalt om, hvis det skal virke som EBay's - eller du skal finde en anden slider
Avatar billede olebole Juniormester
05. februar 2013 - 19:59 #20
Jeg fandt lige denne artikel, som viser 80 sliders til jQuery. Der må være noget, du ret let kan tilpasse dit site  =)
Avatar billede miss_fc Nybegynder
05. februar 2013 - 20:08 #21
Hej Olebole.

Der var en hjemmeside-kyndig der skrev jeg skulle prøve at skifte java-koderne fra 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>




Og badabing badabum så virker det!!!

Jeg er helt overrasket!

Så imorgen aften skyder jeg den nye side i vejret. Jeg skal lige have title m.m. Lidt småtteri.

Igen: mange tak for dine inputs! Hvor er det dejligt at folk man slet ikke kender gerne vil hjælp. :)
Avatar billede olebole Juniormester
05. februar 2013 - 20:22 #22
Ja, changeEv:'hidden' fik jeg også googlet mig frem til, men uden forklaring - og jeg havde ikke lige tid/lyst til at rode koden igennem for en evt. forklaring  =)

Cool, at du fik det til at virke. Du lægger bare selv et svar og accepterer det, så tråden lukkes  =)
Avatar billede miss_fc Nybegynder
05. februar 2013 - 20:26 #23
kifte java-koderne fra 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>




Og badabing badabum så virker det!!!
Avatar billede olebole Juniormester
05. februar 2013 - 20:39 #24
PS: Grunden til, at jeg gerne ville se siden uploaded, var to ting:

Med udvidelsen Firebug i Firefox kan du højreklikke på et element og vælge 'Inspect element with Firebug'. Så oprettes en split-screen, hvor du ser siden i det øverste felt og koden i det nederste - med elementet highlighted.

Fidusen er, at det ikke er den kode, du har skrevet, som vises - men koden, som den ville se ud med de ændringer, som JavaScript har foretaget, siden siden blev loaded. Altså et billede af den aktuelle sides kode. Man kan oven i købet ændre i disse HTML- og CSS-koder og se, hvordan siden så vil se ud.

Det gør det væsentligt lettere at se, hvad der i virkeligheden sker. Især når de fleste af dine JavaScripts ligger på din server og derfor ikke bliver loaded, hvis jeg kopierer din kode og tester den  =)

Den anden ting er forbilledligt beskrevet i et citat af kvantefysikeren Werner Heisenberg:
"Det, vi observerer, er ikke naturen i sig selv - men naturen udsat for vores måde at spørge på."

Det kan synes banalt, og mange på Eksperten er sikkert trætte af at se mig gentage citatet; men lur mig, om ikke det rummer årsagen til mere end 90% af menneskers fejl gennem tiden - og fortsat vil drille os resten af vores arts tid  =)

Når vi oplever en fejl, ligger den ofte et helt andet sted, end vi tror  *o)
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester



IT-JOB