retour haut de page à l'execution d'un script
Bonjour,
J'ai écrit ce code pour un site qui contient une suite d'images en scroll et une légende fixe par dessus.
Il y a un lien 'texte' qui permet de masquer la légende et un lien 'image' qui permet de masquer les images. (pour mieux voir les images et/ou mieux lire le texte)
Seulement, lorsque l'on clique pour faire apparaître ou disparaître le texte par exemple, ça remonte automatiquement en haut de la page en revenant donc à la première image au lieu de garder le scroll la où il était. Comment faire pour permettre à l'utilisateur de masquer la légende en cours de route et en conservant la position du scroll la ou il s'etait arreté ?
Autrement dit, ne pas remonter en haut de la page à l’exécution des scripts :)
merci beaucoup d'avance,:ccool:
J'ai chargé la page ici
et voici mon code :
Code:
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
| <html><head>
<link rel="stylesheet" type="text/css" href="css/style2.css">
<script type="text/javascript">
function part1() {
var contacttext = document.getElementById('img');
if (contacttext.className == 'visible') {
contacttext.className = 'hidden';
} else {
contacttext.className = 'visible';
}
}
function part2() {
var contacttext = document.getElementById('txt');
if (contacttext.className == 'visible') {
contacttext.className = 'hidden';
} else {
contacttext.className = 'visible';
}
}
</script>
</head>
<body>
<div id="cacher-txt" ><a onclick="part2();" href="#">texte</a> </div>
<div id="txt" class="visible" >
<div id="legende" >
Shelf 440 x 40 x 4 cm, </br>
</div>
</div>
<div id="cacher-img" ><a onclick="part1();" href="#">images</a> /div>
<div id="img" class="visible" >
<div id="visuels">
<img src="img/p6/1.jpg">
<img src="img/p6/2.jpg">
<img src="img/p6/3.jpg">
<img src="img/p6/4.jpg">
<img src="img/p6/5.jpg">
<img src="img/p6/6.jpg">
<img src="img/p6/7.jpg">
</div>
</div>
</body></html> |
et le css :
Code:
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
| .hidden {
visibility:hidden;
}
#legende {
position:fixed;
left:23%;
top:80%;
z-index:500;
font-family:arial;
font-size:10px;
color:black;
}
#img {
position:absolute;
width:79%;
right:5.5%;
left:15.5%;
top:20%;
z-index:100;
}
#img img {
width:100%;
}
#cacher-img {
position:fixed;
right:20%;
top:15%;
z-index:500;
}
#cacher-txt {
position:fixed;
right:14%;
top:15%;
z-index: 520;
} |
