Fermer

Visiteur non-identifié | Identifiez-vous | Devenir membre
Code perdu ? | Combien de visiteurs sur votre site ?

Effet d'ouverture sur un mini-formulaire caché

Script posté par :

SirJoJO
Vous aussi, postez vos scripts en cliquant ici.

Description

Ce script permet de faire apparaître en cliquant sur un lien une petit formulaire (ici une formulaire de recherche), avec un effet d'ouverture.
Lorsque le formulaire est totalement apparu, un autre clic sur le lien fait disparaître le formulaire.
Le navigateur du visiteur doit être compatible avec la norme CSS2.

NB : Vous devez modifer les propriétés css left et top de la div cachée pour les adapter à la position de votre lien sur la page.

Pour la configuration, voir les commentaires laissés dans le code.

Compatibilité :

	FireFox : Toutes versions
	Mozilla : 1 et +
	Netscape Navigator : 6 et +
	Internet Explorer : 6 et +

Ce script utilise le DHTML

Chiffres :

Date de création : 1/09/2004
Dernière modif : -
Visites de la page : 34400
Envois par mail : 608

Exemple :

[ Recherche ]
Blablablabla blablabla blablablabla blablabla blablablabla blablabla blablablabla blablabla blablablabla blablabla blablablabla blablabla
Blablablabla blablabla blablablabla blablabla blablablabla blablabla blablablabla blablabla blablablabla blablabla blablablabla blablabla
Blablablabla blablabla blablablabla blablabla blablablabla blablabla blablablabla blablabla blablablabla blablabla blablablabla blablabla
Blablablabla blablabla blablablabla blablabla blablablabla blablabla blablablabla blablabla blablablabla blablabla blablablabla blablabla

Le code :

Entre <HEAD> et </HEAD> :

Entre <BODY> et </BODY> :

[ <a href="#" id="chercher">Recherche</a> ]
<br />
Blablablabla blablabla blablablabla blablabla blablablabla blablabla blablablabla blablabla blablablabla blablabla blablablabla blablabla<br />
Blablablabla blablabla blablablabla blablabla blablablabla blablabla blablablabla blablabla blablablabla blablabla blablablabla blablabla<br />
Blablablabla blablabla blablablabla blablabla blablablabla blablabla blablablabla blablabla blablablabla blablabla blablablabla blablabla<br />
Blablablabla blablabla blablablabla blablabla blablablabla blablabla blablablabla blablabla blablablabla blablabla blablablabla blablabla

<div id="DivCachee">
	
	<form action="/scripts/search.php" onsubmit="return(detect_recherche(this))">
		<TABLE CELLPADDING=0 CELLSPACING=0>
			<TR><TD><B>Rechercher :</B><BR>
		<INPUT TYPE="text" NAME="asked" STYLE="width:130" SIZE=20 VALUE="">
		<SELECT NAME=dest>
			<OPTION VALUE="1"> dans les scripts</OPTION>
			<OPTION VALUE="2"> sur le site</OPTION>
			<OPTION VALUE="3" > sur le web</OPTION>
			<OPTION VALUE="4" SELECTED> sur le forum</OPTION>
		</SELECT>
		<INPUT TYPE="submit" VALUE="OK" onClick="this.value='...'">
		</TD></TR></TABLE>
	</form>

</div>

Dans un fichier nommé OuvertureDiv.js placé dans le même repertoire que votre page :

var ouverture;
function Enregistre() { window.document.getElementById(leLien).onclick=ouvrir; }
function ouvrir() { window.document.getElementById(leLien).onclick=''; window.document.getElementById(NomDiv).style.clip="rect(auto, 0px, 0px, auto)"; window.document.getElementById(NomDiv).style.display='block'; ouverture = window.setInterval("aggrandissement()",VitesseOuverture);}
function aggrandissement() { clipProp = (window.document.getElementById(NomDiv).style.clip).split(" "); pixel = "px"; if(!document.all)	pixel+=","; theRight = new Number(clipProp[1].replace(new RegExp(pixel), '')); theBottom = new Number(clipProp[2].replace(new RegExp(pixel), '')); if(theBottom<PropBottom) /* Script par SirJojO */ theBottom = theBottom+Incrementation; if(theRight<PropRight) /* Forums http://www.editeurjavascript.com/ */ theRight = theRight+Incrementation; else {	window.clearInterval(ouverture); window.document.getElementById(leLien).onclick=cacheBloc;} window.document.getElementById(NomDiv).style.clip="rect(auto, "+theRight+"px, "+theBottom+"px, auto)";}
function cacheBloc() { window.document.getElementById(NomDiv).style.display='none'; window.document.getElementById(leLien).onclick=ouvrir;}
window.onload=Enregistre;

Si vous ne savez pas comment créer le fichier OuvertureDiv.js, demandez a recevoir le script par email, il vous sera alors envoyé en pièce jointe ! Sinon, consultez la FAQ du site.

Services email :

Je désire recevoir ce script par email
Je désire recevoir un email en cas de modification de ce script
Je désire m'abonner à la newsletter de l'éditeur JavaScript

Les annotations des visiteurs :

Pas d'annotation pour ce script.
>> Poster une annotation sur ce script

41 visiteurs
actuellement en ligne

PUBLICITE

ANNUAIRE WEBMAST.

Carat Hosting
100 Mo pour un appel allopass avec Carat Hosting.
http://www.carat-hosting.com/

Cat : Hebergement web
Voir l'annuaire webmaster

LES SCRIPTS :

78 à éditer
68 à copier/coller
247 des membres
2580 sur le web
>> Tous les scripts

LES MEMBRES :

56131 membres
8366 comptes CountUs
1541 comptes myCircle

LES FORUMS :

14 forums
39396 topics
189315 messages
>> Les forums

SONDAGE

La mini-astuce "HTML / CSS" du jour par sadike
Vous ne savez pas trop comment vous y prendre pour faire la mise en forme de votre site en XHTML et CSS? Laissez vous guider par le générateur CSSCreator: http://www.csscreator.com/version2/pagelayout.php
Proposer votre mini-astuce | Archives des mini-astuces

Pseudo :
Code :
	Se souvenir de moi