1. #1
    Nouveau membre du Club
    Profil pro
    Inscrit en
    mars 2007
    Messages
    49
    Détails du profil
    Informations personnelles :
    Âge : 39
    Localisation : France, Paris (Île de France)

    Informations forums :
    Inscription : mars 2007
    Messages : 49
    Points : 34
    Points
    34

    Par défaut jquery et frameset = impossible

    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 !

  2. #2
    Rédacteur/Modérateur

    Avatar de SpaceFrog
    Homme Profil pro
    Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Inscrit en
    mars 2002
    Messages
    37 511
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 67
    Localisation : Royaume-Uni

    Informations professionnelles :
    Activité : Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Secteur : Industrie

    Informations forums :
    Inscription : mars 2002
    Messages : 37 511
    Points : 63 886
    Points
    63 886
    Billets dans le blog
    1

    Par défaut

    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
    Ma page Developpez - Mon Blog Developpez
    Président du CCMPTP (Comité Contre le Mot "Problème" dans les Titres de Posts)
    Deux règles du succès: 1) Ne communiquez jamais à quelqu'un tout votre savoir...
    Votre post est résolu ? Alors n'oubliez pas le Tag


    réalisations :www.oxygen-translations.com|www.saftair.com| www.ouestisol.fr | www.sistac-alizay.fr | www.acoustishop.fr | www.litt.fr | www.ouestventil.fr
    Humour

  3. #3
    Rédacteur

    Avatar de danielhagnoul
    Homme Profil pro
    Étudiant perpétuel
    Inscrit en
    février 2009
    Messages
    5 734
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 67
    Localisation : Belgique

    Informations professionnelles :
    Activité : Étudiant perpétuel
    Secteur : Enseignement

    Informations forums :
    Inscription : février 2009
    Messages : 5 734
    Points : 21 094
    Points
    21 094
    Billets dans le blog
    39

    Par défaut

    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>

    Blog



    Nota bene : si vous devez être compatible avec les navigateurs obsolètes (IE8 et plus), vous devez convertir les codes ES2015 en ES5 avec Babel.

    FAQ JS Tutoriels JS

    Sans l'analyse et la conception, la programmation est l'art d'ajouter des bogues à un fichier texte vide.
    (Louis Srygley : Without requirements or design, programming is the art of adding bugs to an empty text file.)

  4. #4
    Rédacteur/Modérateur

    Avatar de SpaceFrog
    Homme Profil pro
    Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Inscrit en
    mars 2002
    Messages
    37 511
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 67
    Localisation : Royaume-Uni

    Informations professionnelles :
    Activité : Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Secteur : Industrie

    Informations forums :
    Inscription : mars 2002
    Messages : 37 511
    Points : 63 886
    Points
    63 886
    Billets dans le blog
    1

    Par défaut

    Ceci étant Daniel iframe != Framset ...
    Ma page Developpez - Mon Blog Developpez
    Président du CCMPTP (Comité Contre le Mot "Problème" dans les Titres de Posts)
    Deux règles du succès: 1) Ne communiquez jamais à quelqu'un tout votre savoir...
    Votre post est résolu ? Alors n'oubliez pas le Tag


    réalisations :www.oxygen-translations.com|www.saftair.com| www.ouestisol.fr | www.sistac-alizay.fr | www.acoustishop.fr | www.litt.fr | www.ouestventil.fr
    Humour

  5. #5
    Rédacteur

    Avatar de danielhagnoul
    Homme Profil pro
    Étudiant perpétuel
    Inscrit en
    février 2009
    Messages
    5 734
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 67
    Localisation : Belgique

    Informations professionnelles :
    Activité : Étudiant perpétuel
    Secteur : Enseignement

    Informations forums :
    Inscription : février 2009
    Messages : 5 734
    Points : 21 094
    Points
    21 094
    Billets dans le blog
    39

    Par défaut

    Citation Envoyé par SpaceFrog Voir le message
    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"

    Blog



    Nota bene : si vous devez être compatible avec les navigateurs obsolètes (IE8 et plus), vous devez convertir les codes ES2015 en ES5 avec Babel.

    FAQ JS Tutoriels JS

    Sans l'analyse et la conception, la programmation est l'art d'ajouter des bogues à un fichier texte vide.
    (Louis Srygley : Without requirements or design, programming is the art of adding bugs to an empty text file.)

  6. #6
    Rédacteur/Modérateur

    Avatar de SpaceFrog
    Homme Profil pro
    Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Inscrit en
    mars 2002
    Messages
    37 511
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 67
    Localisation : Royaume-Uni

    Informations professionnelles :
    Activité : Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Secteur : Industrie

    Informations forums :
    Inscription : mars 2002
    Messages : 37 511
    Points : 63 886
    Points
    63 886
    Billets dans le blog
    1

    Par défaut

    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 ...
    Ma page Developpez - Mon Blog Developpez
    Président du CCMPTP (Comité Contre le Mot "Problème" dans les Titres de Posts)
    Deux règles du succès: 1) Ne communiquez jamais à quelqu'un tout votre savoir...
    Votre post est résolu ? Alors n'oubliez pas le Tag


    réalisations :www.oxygen-translations.com|www.saftair.com| www.ouestisol.fr | www.sistac-alizay.fr | www.acoustishop.fr | www.litt.fr | www.ouestventil.fr
    Humour

Discussions similaires

  1. Jquery et frameset
    Par Snyper dans le forum jQuery
    Réponses: 6
    Dernier message: 29/05/2012, 12h09
  2. Réponses: 1
    Dernier message: 11/11/2011, 19h01
  3. jquery - append - impossible de le selectionner
    Par dagda01 dans le forum jQuery
    Réponses: 7
    Dernier message: 26/07/2011, 18h09
  4. Réponses: 2
    Dernier message: 12/07/2011, 22h21
  5. [jQuery UI] Impossible d'initialiser un draggable()
    Par Arnaud F. dans le forum jQuery
    Réponses: 3
    Dernier message: 18/08/2010, 09h47

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo