Discussion :

[Jesmar]

salut
j'aimerais savoir comment faire les titles des liens "un peu jolis"
exemple que j'ai vu sur un site : animeka
est-ce qu'on doit programmer ça nous même ou est-ce que ça existe déjà à la base ?
merci

[Bisûnûrs]

Réponse 1 mon colonel.

[Erwan31]

Tu dois passer par du JS pour cela.

[Jesmar]

reçu 5 sur 5
i me reste plus qu'à trouver un exemple

[SpaceFrog]

regarde du coté de window prototype...
Et il me semble que asn nos contributions ou dans nos source nous avons ce genre d'infobulles ...

[Jesmar]

bonjour
je ré-ouvre ce ptit topic pour savoir une chose
j'ai depuis trouvé ce que je voulais mais là j'ai un problème et je sais pas comment le résoudre. mon infobulle est cachée derrière le background de mon div. je suppose que le problème doit être au niveau du css. si kkun a une idée

html

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
 
<div id="page">
  <div id="header">
    <div id="servers">
      <div class="server">
        Serveur 1<br />ip<br /><img src="./images/test.jpg" alt="" onmouseover="montre('allo ?');" onmouseout="cache();" />
      </div>
      <div class="server">
        ...
      </div>
      ...
    </div>
  </div>
</div>

css

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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
 
#page
{
	margin:0;
	padding:0;
	width:100%;
	height:auto;
	background-color:#CCCCCC;
}
 
#header
{
	position:relative;
	float:left;
	margin:0;
	padding:10px 0 0 0;
	width:100%;
	height:200px;
	text-align:left;
	background:url(../images/header.png);
}
 
#servers
{
	position:relative;
	float:right;
	margin:0;
	padding:0;
	width:70%;
	height:auto;
}
 
.server
{
	position:relative;
	float:left;
	margin:0;
	padding:5px 0 5px 0;
	width:200px;
	height:100%;
	background-color:#996699;
	text-align:center;
}
 
.infobulle
{
	position:absolute;
	visibility:hidden;
	border:1px solid Black;
	padding:10px;
	font-family:Verdana, Arial;
	font-size:10px;
	background-color:#FFFFCC;
}