High-Tech Santé Médecine Droit-Finances

Réalisation

vidéo numérique

Rechercher : dans
Par :

[JavaScript] Hauteur totale de la scrollbar

Dernière réponse le 28 mai 2009 à 15:15:21 MHH225, le 26 mai 2009 à 22:49:31 
 Signaler ce message aux modérateurs

Salut,

Pour faire court :
Y a-t-il moyen de récupérer la hauteur totale de la scrollbar d'un div ?

Pour les plus curieux (ou audacieux... :D ), voici le problème entier :


Je fait un script pour prévisualiser le texte entré dans un formulaire, et j'essaie de trouver la hauteur totale de la scrollbar du textarea et de celle du div de prévisualisation pour faire une rapport et repositionner le scroll du div de prévisualisation...

Pour ceux qui n'auraient pas compris (càd tout le monde :P ), voici mon script de repositionnement de la scrollbar du div de prévisualisation :

----------
function scrollPosition(scrollText, totalScrollText, totalScrollPreview) {

scrollPreview = (scrollText * totalScrollPreview) / totalScrollText;

return scrollPreview;

}
----------


ou en version moins condensée...


----------
function scrollPosition(scrollText, totalScrollText, totalScrollPreview) {

rapport = scrollText / totalScrollText; //On calcul le rapport de position du scroll du textarea en fonction de sa hauteur totale

scrollPreview = totalScrollPreview * rapport; //Puis on l'applique au bloc de prévisualisation en fonctio nde sa hauteur totale


return scrollPreview;

}
----------

Merci ;-) !

NB : on parle ici d'un bloc de prévisualisation qui a une hauteur maximale fixe...

NB2 : toute autre solution proposée au problème de positionnement du scrollbar sera accueillie avec joie. A noter tout de même : la réponse à la question est tout de même souhaitée, si du moins elle existe ^^ ! Il y a ce que te donne la vie, et ce que tu en fait. Ce sont­ les deux forces qui font de toi ce que tu es.

Configuration:­ Configuration: Windows Vista
Internet Explorer 7.0

Meilleures réponses pour « [JavaScript] Hauteur totale de la scrollbar » dans :
Javascript - Modifier la hauteur (height) d'un élément HTML VoirPour modifier la hauteur d'un élément HTML en javascript, il suffit d'utiliser sa propriété de style "height". Pour cela vous pouvez y faire référence de la manière suivante : Si vous souhaitez connaître la hauteur (height) d'un bloc HTML, il...
Javascript - Connaître la hauteur d'un élément HTML VoirSi vous souhaitez connaître la hauteur (height) d'un bloc HTML en javascript, il existe deux façons selon les navigateurs : element.offsetHeight element.style.pixelHeight Ainsi, le code suivant permet d'obtenir la hauteur d'un bloc HTML...
Contrôleur hôte USB à haut/bas débit VoirLors de la connexion d'un périphérique USB 2.0, Windows affiche le message suivant : Installez un controleur hôte usb à haut débit ou bien Ce périphérique fonctionnera à vitesse réduite si vous n'avez pas de contrôleur haut débit installé sur votre...
Javascript - Les événements VoirQu'appelle-t-on un événement? Les événements sont des actions de l'utilisateur, qui vont pouvoir donner lieu à une interactivité. L'événement par excellence est le clic de souris, car c'est le seul que le HTML gère. Grâce au Javascript il est...
Javascript - Les variables VoirLe concept de variable Une variable est un objet repéré par son nom, pouvant contenir des données, qui pourront être modifiées lors de l'exécution du programme. En Javascript, les noms de variables peuvent être aussi long que l'on désire,...
Javascript - Introduction au langage Javascript VoirQu'est-ce que le Javascript? Le Javascript est un langage de script incorporé dans un document HTML. Historiquement il s'agit même du premier langage de script pour le Web. Ce langage est un langage de programmation qui permet d'apporter des...
Posez votre question Répondre

1

PhP, le 27 mai 2009 à 19:11:18
  • +1

Bsr
je vois pas trop ce que tu veux faire ...

Pour récupérer la hauteur du scroll d'un div et l'offset (valeur déjà scrollée ) tu peux faire comme ceci 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
	<title>DIV</title>
	<style>
	    *
		{
			margin : 0px;
			border : 10px;
			padding : 0px;
			
		}
				
		#conteneur
		{
			top : 300px;
			left : 100px;
			height : 200px;
			width : 300px;
			background-color : #ff0000;		
			overflow : auto;
			padding-bottom : 50px;

		}
		
		#conteneur img
		{
			display : block;
		}	
	</style>		
	
	<script>
		function info()
		{
			var elt = document.getElementById("conteneur");

			alert("tagName = "+elt.tagName+
				"\nid = "+elt.id+
				"\nscrollTop = "+elt.scrollTop+
				"\nscrollHeight = "+elt.scrollHeight);		
		}
	</script>
</head>
<body>
	<input type="button" id="btn" value="info" onclick="info()">
	<div id="conteneur">
		<img src='image_test.jpg' />
	</div>
</body>
</html>


Remplace l'image image_test.jpg par une des tes images ou la balise img par du texte par ex
PhP  
Il y a 10 types de personnes dans le monde : ceux qui comprennent le binaire et les autres ...

   
Répondre à PhP

2

 MHH225, le 28 mai 2009 à 15:15:21

Donc scrollHeight renverrai la hauteur totale de l'ascenseur ? Ok merci beaucoup ! Il y a ce que te donne la vie, et ce que tu en fait. Ce sont­ les deux forces qui font de toi ce que tu es.

   
Répondre à MHH225
Posez votre question Répondre
Ils ont besoin de votre aide