Maison base de données tutoriel mysql 关于2个div保持一致高度的做法(用js解决)

关于2个div保持一致高度的做法(用js解决)

Jun 07, 2016 pm 03:49 PM
div 修改 pratique à propos 解决 haut

最近修改以前写的一些代码,发现点问题。 比如2个div需要动态的保持一致的高度。 原先的做法是: div style=overflow:hidden div id=left style=margin-bottom:-10000px; padding-bottom:10000px;/div div id=right style=margin-bottom:-10000px; padding-b

最近修改以前写的一些代码,发现点问题。

比如2个div需要动态的保持一致的高度。

原先的做法是:

如果实际的高度不大于10000px,那么这个是没有问题的,如果有一边的实际高度大于了10000px,则另外一边的高度只能被定义为10000px,不符合实际运用的需求。

 

经过测试,用js可以解决这个问题。

代码如下:

var h = document.getElementById("left").offsetHeight > document.getElementById("right").offsetHeight ? document.getElementById("left").offsetHeight : document.getElementById("right").offsetHeight;
document.getElementById("ztleft").style.height = document.getElementById("ztright").style.height = h + "px";

如果是动态生成的div,只要设法取得id,存入js数组,用循环也可以简单的解决问题。

 

Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn

Article chaud

Combien de temps faut-il pour battre Split Fiction?
3 Il y a quelques semaines By DDD
Repo: Comment relancer ses coéquipiers
3 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island Adventure: Comment obtenir des graines géantes
3 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Crystals d'énergie expliqués et ce qu'ils font (cristal jaune)
1 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌

Article chaud

Combien de temps faut-il pour battre Split Fiction?
3 Il y a quelques semaines By DDD
Repo: Comment relancer ses coéquipiers
3 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island Adventure: Comment obtenir des graines géantes
3 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Crystals d'énergie expliqués et ce qu'ils font (cristal jaune)
1 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌

Tags d'article chaud

Bloc-notes++7.3.1

Bloc-notes++7.3.1

Éditeur de code facile à utiliser et gratuit

SublimeText3 version chinoise

SublimeText3 version chinoise

Version chinoise, très simple à utiliser

Envoyer Studio 13.0.1

Envoyer Studio 13.0.1

Puissant environnement de développement intégré PHP

Dreamweaver CS6

Dreamweaver CS6

Outils de développement Web visuel

SublimeText3 version Mac

SublimeText3 version Mac

Logiciel d'édition de code au niveau de Dieu (SublimeText3)

Solution au problème selon lequel le pack de langue chinoise ne peut pas être installé sur le système Win11 Solution au problème selon lequel le pack de langue chinoise ne peut pas être installé sur le système Win11 Mar 09, 2024 am 09:48 AM

Solution au problème selon lequel le pack de langue chinoise ne peut pas être installé sur le système Win11

Cinq conseils pour vous apprendre à résoudre le problème du téléphone Black Shark qui ne s'allume pas ! Cinq conseils pour vous apprendre à résoudre le problème du téléphone Black Shark qui ne s'allume pas ! Mar 24, 2024 pm 12:27 PM

Cinq conseils pour vous apprendre à résoudre le problème du téléphone Black Shark qui ne s'allume pas !

Comment changer le nom personnel dans le groupe sur DingTalk_Comment modifier le nom personnel dans le groupe sur DingTalk Comment changer le nom personnel dans le groupe sur DingTalk_Comment modifier le nom personnel dans le groupe sur DingTalk Mar 29, 2024 pm 08:41 PM

Comment changer le nom personnel dans le groupe sur DingTalk_Comment modifier le nom personnel dans le groupe sur DingTalk

Comment résoudre le problème de l'enregistrement automatique des images lors de la publication sur Xiaohongshu ? Où est l'image enregistrée automatiquement lors de la publication ? Comment résoudre le problème de l'enregistrement automatique des images lors de la publication sur Xiaohongshu ? Où est l'image enregistrée automatiquement lors de la publication ? Mar 22, 2024 am 08:06 AM

Comment résoudre le problème de l'enregistrement automatique des images lors de la publication sur Xiaohongshu ? Où est l'image enregistrée automatiquement lors de la publication ?

Le pilote ne peut pas être chargé sur cet appareil. Comment résoudre ce problème ? (Testé personnellement et valide) Le pilote ne peut pas être chargé sur cet appareil. Comment résoudre ce problème ? (Testé personnellement et valide) Mar 14, 2024 pm 09:00 PM

Le pilote ne peut pas être chargé sur cet appareil. Comment résoudre ce problème ? (Testé personnellement et valide)

Mar 22, 2024 pm 12:51 PM

Des astuces pour modifier le temps de sommeil de Win10 révélées Des astuces pour modifier le temps de sommeil de Win10 révélées Mar 08, 2024 pm 06:39 PM

Des astuces pour modifier le temps de sommeil de Win10 révélées

Comment résoudre le problème du son faible sur les téléphones mobiles Apple Comment résoudre le problème du son faible sur les téléphones mobiles Apple Mar 08, 2024 pm 01:40 PM

Comment résoudre le problème du son faible sur les téléphones mobiles Apple

See all articles