Toon posts:

[CSS] layers en z-index

Pagina: 1
Acties:

woensdag 17 augustus 2005 17:51

Acties:
  • ekkoper
  • Registratie: Augustus 2003
  • Laatst online: 17-11-2024

ekkoper

Topicstarter
Hey
Ik ben bezig met een website en daarvoor gebruik ik (een soort van) layers.
Het wil alleen niet zo lukken.
Het idee is dat wanneer je boven een link gaat hangen, er een tekstje rechts van de link komt te staan (bv. "klik hier"). Dit werkt.
Het andere idee is dat op datzelfde moment er een "e" aan de linkerkant van de link komt te staan en daarnaast, aan de rechterkant van die "e", de tekst "duard's".. deze tekst ("duard's") moet dan ACHTER de link komen te staan, zodat ie niet te veel opvalt..


De tekst "duard's" komt dus VOOR de link te staan... dat wil ik niet :@..
Kan iemand me misschien helpen of me vertellen dat wat ik wil onmogelijk is (als dat zo is..)
Alvast bedankt!
Eduard

[ Voor 16% gewijzigd door ekkoper op 17-01-2010 12:33 ]

woensdag 17 augustus 2005 18:43

Acties:

Verwijderd

In mijn FX komt de 'E' voor de link te staan en "duard's" ervoor. Plaats even een plaatje ter illustratie van je vraag want ik begrijp niet goed wat je bedoelt.

woensdag 17 augustus 2005 18:55

Acties:
  • ekkoper
  • Registratie: Augustus 2003
  • Laatst online: 17-11-2024

ekkoper

Topicstarter
Verwijderd schreef op woensdag 17 augustus 2005 @ 18:43:
In mijn FX komt de 'E' voor de link te staan en "duard's" ervoor. Plaats even een plaatje ter illustratie van je vraag want ik begrijp niet goed wat je bedoelt.
Het enige wat dus anders moet is dat "duard's" op de achtergrond moet en "Foto's" op de voorgrond. (dat was misschien niet helemaal duidelijk nee, sorry)

[ Voor 28% gewijzigd door ekkoper op 27-05-2016 22:18 ]

woensdag 17 augustus 2005 21:40

Acties:

Verwijderd

Ik heb je probleem opgelost m.b.v. javascript. Wel ranzig opzich, maar altijd nog minder ranzig dan niet-valide elementen binnen een link zetten. Elementen binnen een link plaatsen is sowieso semantisch niet correct. Kijk even of je op internet een goede selfmade 'getElementsByClassName' kunt vinden zodat je met classes i.p.v. id's kunt werken. Althans ik neem aan dat je meerdere links per pagina gaat opnemen? Succes!

HTML:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60

<!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=iso-8859-1">
<title>Untitled Document</title>
<style type="text/css">
    
    body
    {
        background-color: #000000;
    }
    
    a
    {
        text-decoration: none;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 150%;
        color: #0000FF;
        float: left;
        margin-left: -40px;
    }
    
    #linkPrefix
    {
        font-size: 70%;
        font-family: Arial, Helvetica, sans-serif;
        color: #FFFF00;
        float: left;
        visibility: hidden;
    }

    #linkPrefix:first-letter 
    {
        font-size:20px; /*Kan kennelijk niet procentueel gedefinieerd worden ;'(*/
    }
    
    #linkSuffix
    {
        font-family: Arial, Helvetica, sans-serif;
        color: #FF0000;
        font-size: 100%;
        visibility: hidden;
    }

</style>
<script language="javascript" type="text/javascript">

    function visibility(sAction)
    {
        document.getElementById("linkPrefix").style.visibility = sAction;
        document.getElementById("linkSuffix").style.visibility = sAction;
    }

</script>
</head>
<body>
    <div id="linkPrefix">Eduards</div><a href="javascript://" onmouseover="visibility('visible')" onmouseout="visibility('hidden')">Fotos</a><div id="linkSuffix">Bekijk ze!</div>
</body>
</html>

[ Voor 68% gewijzigd door Verwijderd op 17-08-2005 22:47 ]

Reageer