ascenseurs et javascript

**Bovino** · 03/03/2011, 21h55

Code :

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

1
2
3
document.getElementById("frame1").onscroll = function() {
	document.getElementById("frame2").scrollTop = this.scrollTop;
};

Lorsque tu scrolles dans l'iframe, l'événement n'est pas lié à la balise iframe mais au body du document qu'elle contient.

**breizhlama** · 03/03/2011, 22h06

Code :

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

1
2
3
document.getElementById("frame1").onscroll = function() {
	document.getElementById("frame2").scrollTop = this.scrollTop;
};

si j'ai bien compris ce que tu as dis je dois faire ça ?

Code :

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

1
2
3
document.getElementById("frame1").body.onscroll = function() {
	document.getElementById("frame2").body.scrollTop = this.scrollTop;
};

Désolé mais j'ai un peu de mal à comprendre avec les frames et les iframes. J'avoue que j'aurais pu commencer par plus facile comme problème. Mais c'est une fonctionnement que j'ai besoin pour une appli web.

**Bovino** · 03/03/2011, 22h35

Une page Web est un document HTML.
Or une frame ou une iframe intègrent dans cette page un nouveau document HTML qui possède ses propres propriétés.
Dans un document HTML, si tu as par exemple

Code :

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

<div style="overflow:scroll"></div>

c'est bien l'élément div qui reçoit l'événement scroll, mais avec

Code html" :

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

<iframe scrolling="auto"></iframe>

ce n'est pas l'élément iframe qui reçoit l'événement mais le body de l'iframe, c'est donc sur ce body qu'il faut récupérer l'événement.

**breizhlama** · 03/03/2011, 23h37

Merci beaucoup aux personnes qui ont réagis par rapport à mon problème. J'ai compris finalement comment ça fonctionnait. Pour ceux que ca pourrait aider plus tard je donne mon code pour cela.

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
	<html>	
		<head>
			<script type="text/javascript">
				function scrollTwin(f1, f2, f3)
				{
				 document.frames[f3].document.body.onscroll = function(){
				 window.parent.document.frames[f1].scroll(window.parent.document.frames[f3].document.body.scrollLeft,0);
				 window.parent.document.frames[f2].scroll(0,window.parent.document.frames[f3].document.body.scrollTop);
				 }
				}
			</script>
 
 
 
		</head>
 
 
				<FRAMESET ROWS="15%,85%" COLS="24%,76%" onLoad="scrollTwin('frame1','frame2','frame3')"> 
					<FRAME SRC="frame0.htm" Scrolling="no" NAME="frame0">
 
					<FRAME SRC="frame1.htm" Scrolling="no" NAME="frame1">
 
 
					<FRAME SRC="frame2.htm" Scrolling="no" NAME="frame2">
 
					<FRAME SRC="frame3.htm" NAME="frame3" Scrolling="yes" id="frame3">
 
				</FRAMESET> 
 
 
	</html>

Merci encore

ascenseurs et javascript

JavaScript

Discussions similaires

Partager

Partager