11548 sujets

JavaScript, DOM et API Web HTML5

Cacher une image

Bonjour,

J'ai créé une liste déroulante tout marche sauf un petit problème.
Je voudrais que lorsque je clic sur du blanc ou un autres boutons la liste déroulante reviennes sur le "sélectionner un plis"

Voilou mon code :


&nbsp;<input type="radio" value="dépliants" name="travail" id="travail_depliants" onclick="document.getElementById('ferme_l').disabled=true;document.getElementById('ferme_h').disabled=true;document.getElementById('ouvert_l').disabled=true;document.getElementById('ouvert_h').disabled=true;document.getElementById('menu_deroulant').disabled=false"/><label for="travail_depliants">&nbsp;D&eacute;pliants</label>
                                <select size="1" name="menu_deroulant" id="menu_deroulant" onchange="document.getElementById('image1').src=this.value;">
                                <option value="http://www.loisircreatif.net/boutique/images_produits/vJPB_BLANC_ANTIQUE_1.jpg" ">&nbsp;S&eacute;lectionnez un type de plis</option>
				<option value="http://www.zappingconception.com/depliants/images/1pli-2volets-verticale.jpg">&nbsp;1pli 2volets vertical</option>
				<option value="http://www.zappingconception.com/depliants/images/1pli-2volets-horizontale.jpg">&nbsp;1pli 2volets horizontal</option>
				<option value="http://www.zappingconception.com/depliants/images/2plis-roules-3volets.jpg">&nbsp;2plis roulés 3volets</option> 
				<option value="http://www.zappingconception.com/depliants/images/3plis-zig-zag-4volets.jpg">&nbsp;3plis zig-zag 4volets</option>
				<option value="http://www.zappingconception.com/depliants/images/plis-portefeuilles.jpg">&nbsp;plis portefeuille</option>
				</select>
                                  <img id="image1" style="display:block"/>


Merci d'avance de votre aide.
Modifié par Rainarkan (10 Feb 2011 - 11:13)
sur du blanc ? un autre boutons ?
EDIT :


<input type="radio" value="dépliants" name="travail" id="travail_depliants" onclick="document.getElementById('ferme_l').disabled=true;document.getElementById('ferme_h').disabled=true;document.getElementById('ouvert_l').disabled=true;document.getElementById('ouvert_h').disabled=true;document.getElementById('menu_deroulant').disabled=false"/>
<label for="travail_depliants">Depliants</label> 
<select size="1" name="menu_deroulant" id="menu_deroulant" onchange="document.getElementById('image1').src=this.value;"> 
	<option value="http://www.loisircreatif.net/boutique/images_produits/vJPB_BLANC_ANTIQUE_1.jpg" >selectionnez un type de plis</option> 
    <option value="http://www.zappingconception.com/depliants/images/1pli-2volets-verticale.jpg">&nbsp;1pli 2volets vertical</option> 
    <option value="http://www.zappingconception.com/depliants/images/1pli-2volets-horizontale.jpg">&nbsp;1pli 2volets horizontal</option> 
    <option value="http://www.zappingconception.com/depliants/images/2plis-roules-3volets.jpg">&nbsp;2plis roulés 3volets</option>  
    <option value="http://www.zappingconception.com/depliants/images/3plis-zig-zag-4volets.jpg">&nbsp;3plis zig-zag 4volets</option> 
    <option value="http://www.zappingconception.com/depliants/images/plis-portefeuilles.jpg">&nbsp;plis portefeuille</option> 
</select> 
<div id="blanc ? " onclick="document.getElementById('menu_deroulant').selectedIndex = 0;document.getElementById('image1').src=document.getElementById('menu_deroulant').value;">
     <img id="image1" style="display:block"/> 
</div>

Modifié par Su4p (10 Feb 2011 - 16:14)
Si je comprends bien ton code ta cachée le menu déroulant mais moi je veux que sa soit les images qui ce cache a chaque fois qu'on clic sur un autre bouton radio . =/
Nan tu n'as pas compris,
mon code fais que :
Si tu cliques sur du "blanc" le select reviens à la position 0 et l'image est cachée.
Au pire si tu es [edit= maline ] tu copie mon code, tu le colle et tu vois ce que ça fait...
Modifié par Su4p (10 Feb 2011 - 16:56)
Excuse moi de ne pas avoir était "maline".

Mais si c'était possible j'aimerai plus que si c'était sur un bouton radio ; donc possible de remplacer la valeur "blanc" par une valeur des boutons radios ou autres ? s'il te plaît.
Ta un bouton radio
un bouton radio mon menu déroulant ( image quand je choisit un onglet )
un bouton radio

Quand je clic sur un bouton radio je veux que l'image disparaisse; est-ce possible avec ton code de le faire si on remplace quelques choses ?
Suffit de copier le code que je t'es donné et de le collé ou tu veux la je te l'ai mis dans un autre radio button :


<input type="radio" value="dépliants" name="travail" id="travail_depliants" onclick="document.getElementById('ferme_l').disabled=true;document.getElementById('ferme_h').disabled=true;document.getElementById('ouvert_l').disabled=true;document.getElementById('ouvert_h').disabled=true;document.getElementById('menu_deroulant').disabled=false"/> 
<label for="travail_depliants">Depliants</label>  
<select size="1" name="menu_deroulant" id="menu_deroulant" onchange="document.getElementById('image1').src=this.value;">  
    <option value="http://www.loisircreatif.net/boutique/images_produits/vJPB_BLANC_ANTIQUE_1.jpg" >selectionnez un type de plis</option>  
    <option value="http://www.zappingconception.com/depliants/images/1pli-2volets-verticale.jpg">&nbsp;1pli 2volets vertical</option>  
    <option value="http://www.zappingconception.com/depliants/images/1pli-2volets-horizontale.jpg">&nbsp;1pli 2volets horizontal</option>  
    <option value="http://www.zappingconception.com/depliants/images/2plis-roules-3volets.jpg">&nbsp;2plis roulés 3volets</option>   
    <option value="http://www.zappingconception.com/depliants/images/3plis-zig-zag-4volets.jpg">&nbsp;3plis zig-zag 4volets</option>  
    <option value="http://www.zappingconception.com/depliants/images/plis-portefeuilles.jpg">&nbsp;plis portefeuille</option>  
</select>  
<div id="blanc ? " onclick="document.getElementById('menu_deroulant').selectedIndex = 0;document.getElementById('image1').src=document.getElementById('menu_deroulant').value;"> 
     <img id="image1" style="display:block"/>  
</div>
<input type="radio" name="travail" onclick="document.getElementById('menu_deroulant').selectedIndex = 0;document.getElementById('image1').src=document.getElementById('menu_deroulant').value;"/>

Cependant je te conseil d'en faire une fonction se sera plus simple à manipuler
Modifié par Su4p (10 Feb 2011 - 17:20)
Sujet clos
Aller à