IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

JavaScript Discussion :

Barre de défillement avec 3 buttons(images) en javascript


Sujet :

JavaScript

  1. #1
    Membre averti
    Profil pro
    Inscrit en
    Juillet 2006
    Messages
    54
    Détails du profil
    Informations personnelles :
    Localisation : Canada

    Informations forums :
    Inscription : Juillet 2006
    Messages : 54
    Par défaut Barre de défillement avec 3 buttons(images) en javascript
    Bonjour tout le monde,
    Je ne sais pas est ce que ma requête est dans le bon endroit.
    J’ai un code pour créer un ascenseur personnalité grâce à des buttons (images en bas et en haut).
    Ce que je voulais faire, c’est d’ajouter un button au milieu de la barre pour afficher combien du texte il reste.
    Voic mon code :
    éplacement géré par javascript
    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
    <script language="javascript" type="text/javascript">
    var Timer;
    var Pas = 3;
    function moveLayer(Sens) {
    	Objet=document.getElementById("contenu");
        if(parseInt(Objet.style.top) + (Pas*Sens)>0)  {
    		clearTimeout(Timer);
    	}
    	else if(parseInt(Objet.style.top) + (Pas*Sens)<-(Objet.offsetHeight-document.getElementById("support").offsetHeight)) {
    		clearTimeout(Timer);
    	}
        else {
            Objet.style.top = (parseInt(Objet.style.top) + (Pas*Sens)) + "px";
    	}
    	Timer = setTimeout("moveLayer(" + Sens + ");", 30);
    }
    </script>
    Positionnement des bloque grâce au css
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    <div id="support" style="position:relative; width:150px; height:280px; overflow:hidden; border:1px solid #000;">	
    	<div id="contenu" style="position:absolute; top:0;">
    		DEBUT<br />ligne1<br />ligne2<br />ligne3<br />ligne4<br />ligne5<br />ligne6<br />
    		ligne7<br />ligne8<br />ligne9<br />ligne10<br />ligne11<br />ligne12<br />ligne13<br />
    		ligne14<br />ligne15<br />ligne16<br />ligne17<br />ligne18<br />ligne19<br />FIN<br />
    	</div>
    	<div style="background-color:#0F0; width:22px; height:280px; position:absolute; right:0; border-left:1px solid #000;">
    		<img onmouseover="moveLayer(1);" onmouseout="clearTimeout(Timer);" src="slideup.png" style="cursor:pointer; position:absolute; right:0;" alt="" />
    		<img onmouseover="moveLayer(-1);" onmouseout="clearTimeout(Timer);" src="slidedown.png" style="cursor:pointer; position:absolute; right:0; bottom:0;" alt="" />		
    	</div>
    </div>
    Images attachées Images attachées  

  2. #2
    Membre Expert
    Avatar de gwyohm
    Homme Profil pro
    Développeur informatique
    Inscrit en
    Octobre 2007
    Messages
    925
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 45
    Localisation : France, Paris (Île de France)

    Informations professionnelles :
    Activité : Développeur informatique

    Informations forums :
    Inscription : Octobre 2007
    Messages : 925
    Par défaut
    bonjour,

    Il faut donc que tu gères une div ou une image "ascensseur" que tu déplaces dans ta div qui simule la barre de défilement en appliquant pour sa valeur top un ratio entre la taille totale de la div "scrollée" qui a pour équivalent la div "barre de défilement" et la position de la div contenu qui a pour équivalent le bouton ascensseur

  3. #3
    Membre averti
    Profil pro
    Inscrit en
    Juillet 2006
    Messages
    54
    Détails du profil
    Informations personnelles :
    Localisation : Canada

    Informations forums :
    Inscription : Juillet 2006
    Messages : 54
    Par défaut Barre de défillement avec 3 buttons(images) en javascript
    C'est exactement ce que j'ai pensé au début,mais est ce que vous avez une partie de code?

Discussions similaires

  1. lien avec button image
    Par goldy91 dans le forum Débuter
    Réponses: 7
    Dernier message: 17/06/2009, 11h22
  2. [HTML 4.0] Pas de barre de défillement avec window.showModDialog
    Par beegees dans le forum Balisage (X)HTML et validation W3C
    Réponses: 4
    Dernier message: 19/02/2009, 20h09
  3. personnaliser une barre d'outils avec une image
    Par rider74 dans le forum MFC
    Réponses: 2
    Dernier message: 03/01/2007, 21h28
  4. Réponses: 5
    Dernier message: 08/02/2005, 20h50
  5. Réponses: 13
    Dernier message: 14/10/2003, 14h31

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