»
AnglaisFrançaisVietnamien

Imprimer - Dropdown Description Toggle - JavaScriptBank.com

Version complète: jsB@nk » Lien » Tooltip » Dropdown Description Toggle
URL: https://www.javascriptbank.com/dropdown-description-toggle.html

Dropdown Description Toggle © JavaScriptBank.comCe code utilise à la fois CSS de concevoir et de description de contenu JavaScript pour effectuer les effet de bascule pour les liens, les utilisateurs cliquent sur le lien le faire tomber vers le bas, cliquez à nouveau pour fermer. Excellent si vous voulez des informations et de ne pas avoir à se soucier de popup bloquants.

Version complète: jsB@nk » Lien » Tooltip » Dropdown Description Toggle
URL: https://www.javascriptbank.com/dropdown-description-toggle.html



CSS
<style type="text/css">#dhtmlgoodies_contentBox {  border:1px solid #317082;  height:0px;  visibility:hidden;  position:absolute;  background-color:#E2EBED;  overflow:hidden;  padding:2px;  width:250px;}#dhtmlgoodies_content {  position:relative;    font-family: Trebuchet MS, Lucida Sans Unicode, Arial, sans-serif;  width:100%;  font-size:0.8em;}#dhtmlgoodies_slidedown {  position:relative;  width:250px;}</style>


JavaScript
<script type="text/javascript" name="dropDown.js">// Created by: Alf Magne Kalleland :: http://www.dhtmlgoodies.com//************************************************************************************************************(C) www.dhtmlgoodies.com, September 2005Terms of use: You are free to use this script as long as the copyright message is kept intact. However, you may not redistribute, sell or repost it without our permission.Alf Magne Kalleland************************************************************************************************************/var initHeight = 0;var slidedown_direction = 1;var slidedownContentBox = false;var slidedownContent = false;var slidedownActive = false;var contentHeight = false;var slidedownSpeed = 3;  // Higher value = faster scriptvar slidedownTimer = 7; // Lower value = faster scriptfunction slidedown_showHide() {  if(initHeight==0)slidedown_direction=slidedownSpeed; else slidedown_direction = slidedownSpeed*-1;  if(!slidedownContentBox) {    slidedownContentBox = document.getElementById('dhtmlgoodies_contentBox');    slidedownContent = document.getElementById('dhtmlgoodies_content');    contentHeight = document.getElementById('dhtmlgoodies_content').offsetHeight;  }  slidedownContentBox.style.visibility='visible';  slidedownActive = true;  slidedown_showHide_start();}function slidedown_showHide_start() {  if(!slidedownActive)return;  initHeight = initHeight/1 + slidedown_direction;  if(initHeight <= 0) {    slidedownActive = false;     slidedownContentBox.style.visibility='hidden';    initHeight = 0;  }  if(initHeight>contentHeight) {    slidedownActive = false;   }  slidedownContentBox.style.height = initHeight + 'px';  slidedownContent.style.top = initHeight - contentHeight + 'px';  setTimeout('slidedown_showHide_start()',slidedownTimer); // Choose a lower value than 10 to make the script move faster}function setslidedownWidth(newWidth) {  document.getElementById('dhtmlgoodies_slidedown').style.width = newWidth + 'px';  document.getElementById('dhtmlgoodies_contentBox').style.width = newWidth + 'px';}function setSlideDownSpeed(newSpeed) {  slidedownSpeed = newSpeed;}</script>


HTML
<div id="dhtmlgoodies_slidedown"> <div id="dhtmlgoodies_control">    <a href="#" onclick="slidedown_showHide();return false;">Try it</a>  </div>  <div id="dhtmlgoodies_contentBox">  <div id="dhtmlgoodies_content"><!-- slide down content goes here -->Ma quande lingues coalesce, li grammatica del resultant lingue es plu simplic e regulari quam ti del coalescent lingues. Li nov lingua franca va esser plu simplic e regulari quam li existent Europan lingues.<br><br><!-- End slide down content -->  </div>  </div></div><script type="text/javascript">setSlideDownSpeed(4);</script>