Discussion :

[scavenger]

salut

je veux resizer une frame avec animate.

Oui les frames sont deprecated merci on est au courant mais voilà par exemple, subsonic est développé comme ça et je ne crois pas que son créateur ait envie de tout revoir. Et on a pas tous le temps de forker des projets et de les reprendre à notre compte à chaque fois qu'on a envie d'apporter des petites modifications à un outil complexe et qui marche bien.

ce qu'il faut savoir c'est que jQuery n'agit que sur le CSS, donc animer l'attribut cols de la balise frameset est impossible avec jQuery.animate : http://api.jquery.com/animate/

resizer une frame avec un input ou un lien à l'intérieur est facile et ça marche bien :

Code :

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

1
2
3
<input type="button" value="resize" onClick="javascript:parent.document.getElementById('parentFramesetID').cols='*,20';">
<a href="#" onclick="javascript:parent.document.getElementById('parentFramesetID').cols='*,20';">resize</a>
<input type="button" value="anim" onClick="javascript:$('#parentFramesetID', top.document).attr({'cols':'*,20'});">

au passage le mot clef "javascript:" est superflu mais je trouve ça plus propre.
par contre pour l'animate c'est plus complexe : il faut faire des fonctions dédiées.

Exemple moche et qui bouffe du CPU mais qui marche :

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
 
<script type="text/javascript">
	var x = 20;
	var min = 20;
	var max = 200;
	var delay = 1;
	var step = 20;
	function enlargeFrameSet () {
	  x += step;
	  document.getElementById('middleframe').cols = '*,' + x;
	  if (x < max)
	    setTimeout('enlargeFrameSet()', delay);
	}
	function shrinkFrameSet () {
	  x -= step;
	  document.getElementById('middleframe').cols = '*,' + x;
	  if (x > min)
	    setTimeout('shrinkFrameSet()', delay);
	}
	$(function() {
	    $("#right")
		.mouseover(function() {
		    enlargeFrameSet();
		})
		.mouseout(function() {
		    shrinkFrameSet();
		});
	});
</script>
<frameset id="middleframe" cols="*,20" border="1">
    <frame id="main" name="main" src="main.html">
    <frame id="right" name="right" src="right.html" scrolling="no">
</frameset>

maintenant si quelqu'un a une solution pour le faire en jquery ou toute autre fonction qui permette un resize smooth et qui ne bouffe pas le CPU je suis preneur !

[SpaceFrog]

tu ne peux pas animer les width ?
tu vires les cols et tu passe par les width ...

sinon
http://stackoverflow.com/questions/1...frame-resizing

[danielhagnoul]

Code :

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

<iframe id="frameID" frameborder="0" src="dvp2.html"></iframe> <!-- src="http://danielhagnoul.developpez.com/"></iframe> -->

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
$(function(){
 
	/*
	 * Le changement de largeur fonctionne toujours.
	 * 
	 * Le changement de couleur (ou une autre modification du contenu) seulement 
	 * si le contenu de l'iframe à la même origine que la page principale.
	 */
	$( "#frameID" )
		.animate({ "width" : "+=250px" }, 5000 )
		.contents().find( "body" ).animate({ "background-color" : "yellow", "opacity" : 0.5 }, 5000 );
 
});

Tester sur Chrome et Firefox avec :

Code :

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

1
2
3
<script src="http://code.jquery.com/jquery-1.9.0b1.js"></script>
 <!--<script src="http://code.jquery.com/jquery-migrate-1.0.0b1.js"></script>-->
 <script src="http://code.jquery.com/color/jquery.color-2.1.1.min.js"></script>

[SpaceFrog]

Ceci étant Daniel iframe != Framset ...

[danielhagnoul]

Ceci étant Daniel iframe != Framset ...

J'avais cru comprendre que l'on parlait d'archéologie HTML avec un "iframe" pas du néolithique HTML avec un "frameset"

[SpaceFrog]

Oui les frames sont deprecated merci on est au courant mais voilà par exemple, subsonic est développé comme ça et je ne crois pas que son créateur ait envie de tout revoir.

Quand on est liè a une techno, parfois on n'a pas le choix ...