Caché des zone dans une page web,div,case,ligne de tableau...

Contenu du snippet

le code source montre comment caché des zone dans une page celon la demande ou aprés le click dans un objet (dans l'exmple l'objet est une image de + qui devitn - Onclik())

Source / Exemple :

//***********************************Fonction qui ouvre l'objet +  ****************************************

function OpenPlus(PlusID)
{
var img = document.getElementById(PlusID);
img.src = "minus.gif";
}

function ClosePlus(PlusID)
{
var img = document.getElementById(PlusID);
img.src = "plus.gif";

}
//**********************************************************************************************************

//***********************************Fonction qui ouvre et ferme l'objet >> ********************************

function UpCollaps(PlusID)
{
   var img = document.getElementById(PlusID);
   img.src = "collapse3.jpg";
}
function DownCollaps(PlusID)
{
   var img = document.getElementById(PlusID);
   img.src = "expand3.jpg";
}







function DivStatus(numero,nb)
	{
			var TCodePromo=new Array();
	        var TcodeFinance=new Array();
	        var TcodeCommercial=new Array();
		    var EntityName;
			var divID = numero;
			var CodeId;
			var i;
			var k;
			EntityName=numero.slice(0,5);
			switch(EntityName)
			{
			
			// *****************************************Traittement Promo ******************************************************
			case "Promo":
			
			for(i=0;i<nb;i++)
			{
				CodeId=numero.concat(i);
				TCodePromo[i]=CodeId;
				if ( document.getElementById && document.getElementById( CodeId ) ) // Pour les navigateurs récents
					{
						Pdiv = document.getElementById( CodeId );
						PcH = true;
					
					}
					else
					{
						PcH = false;
					
					}
					if ( PcH )
					{
						Pdiv.className = ( Pdiv.className == 'cachediv' ) ? '' : 'cachediv';
					}
			}
			if(PromoPlusArray[numero]==1)
			{
						OpenPlus('Plus'+numero);
						PromoPlusArray[numero]=0;
						for(k=0;k<TCodePromo.length;k++)
						{
							MontreTout(TCodePromo[k]);
						}
					
					
			}else
			{
				ClosePlus('Plus'+numero);
				PromoPlusArray[numero]=1;
				for(k=0;k<TCodePromo.length;k++)
					{
						CacheTout(TCodePromo[k]);
					}
					
			}
			
			break;
			// ***************************************** fin Traittement Promo ******************************************************
			
			//******************************************Traittement Commercial*****************************************************
			case "Comme":
			for(i=0;i<nb;i++)
			{
				CodeId=numero.concat(i);
				TcodeCommercial[i]=CodeId;
				if ( document.getElementById && document.getElementById( CodeId ) ) // Pour les navigateurs récents
					{
						Pdiv = document.getElementById( CodeId );
						PcH = true;
					
					}
					else
					{
						PcH = false;
					
					}
					if ( PcH )
					{
						Pdiv.className = ( Pdiv.className == 'cachediv' ) ? '' : 'cachediv';
					}
			}
			if(CommercialPlusArray[numero]==1)
			{
						OpenPlus('Plus'+numero);
						CommercialPlusArray[numero]=0;
						for(k=0;k<TcodeCommercial.length;k++)
						{
							MontreTout(TcodeCommercial[k]);
						}
						
					
			}else
			{
				ClosePlus('Plus'+numero);
				CommercialPlusArray[numero]=1;
				for(k=0;k<TcodeCommercial.length;k++)
				{
					CacheTout(TcodeCommercial[k]);
				}
					
			}
			
			break;
			//******************************************fin Traittement Commercial*****************************************************
			case "Finan":
			for(i=0;i<nb;i++)
			{
			CodeId=numero.concat(i);
			TcodeFinance[i]=CodeId;
			if ( document.getElementById && document.getElementById( CodeId ) ) // Pour les navigateurs récents
				{
					Pdiv = document.getElementById( CodeId );
					PcH = true;
					
				}
				else
				{
					PcH = false;
					
				}
				if ( PcH )
				{
					Pdiv.className = ( Pdiv.className == 'cachediv' ) ? '' : 'cachediv';
				}
			}
			if(FinancePlusArray[numero]==1)
					{
					OpenPlus('Plus'+numero);
					FinancePlusArray[numero]=0;
					for(k=0;k<TcodeFinance.length;k++)
					{
					MontreTout(TcodeFinance[k]);
					}
					
					
					}else
					{
					ClosePlus('Plus'+numero);
					FinancePlusArray[numero]=1;
					for(k=0;k<TcodeFinance.length;k++)
					{
					CacheTout(TcodeFinance[k]);
					}
					
					}
			break;
			}
	}
		
		
		
		
		
		
		
		
		
		
		
		
		
		
		
		
		
	/*
	* Cache tous les divs ayant le même préfixe
	*/
	function CacheTout( nom )
		{	
			var NumDiv = 0;
			var divID;
			if ( document.getElementById ) // Pour les navigateurs récents
				{
					while ( document.getElementById( nom.concat(NumDiv)))
						{
							SetDiv = document.getElementById( nom + NumDiv );
							//*******************************************************************************
							if ( SetDiv && SetDiv.className != 'cachediv' )
								{
									//DivStatus( nom, NumDiv );
									divID=nom.concat(NumDiv);
									if ( document.getElementById && document.getElementById( divID ) ) // Pour les navigateurs récents
									{
									Pdiv = document.getElementById( divID );
									PcH = true;
									}
									else
									{
									PcH = false;
									}
									if ( PcH )
									{
									Pdiv.className = ( Pdiv.className == 'cachediv' ) ? '' : 'cachediv';
									}
								}
							NumDiv++;
							
						}
				}
			
		}
		
		
	/*
	* Montre tous les divs ayant le même préfixe
	*/
	function MontreTout( nom )
		{	
			var NumDiv = 0;
			var divID;
			if ( document.getElementById ) // Pour les navigateurs récents
				{
					while ( document.getElementById(nom.concat(NumDiv)))
						{
						//alert('koko');
							SetDiv = document.getElementById(nom.concat(NumDiv));
							if ( SetDiv || SetDiv.className != '' )
							{
									divID=nom.concat(NumDiv);
									if ( document.getElementById && document.getElementById( divID ) ) // Pour les navigateurs récents
									{
									Pdiv = document.getElementById( divID );
									PcH = true;
									}
									else
									{
									PcH = false;
									}
									if ( PcH )
									{
									Pdiv.className = ( Pdiv.className == 'cachediv' ) ? '' : 'cachediv';
									}
							}
							NumDiv++;
						}
				}
			
		}
		
		
		
		//alert('kkkk');
		
		
	function ShowMarketingEntity( numero,nb )
		{
		    SetDiv = document.getElementById(numero);
			var NumDiv=0;
			var NumDiv2=0;
			var numero2;
		  // alert(nb);
			if ( MarketingEntityStatus==0)
			{
			
			  DownCollaps('MarkeCollaps');
			             while ( document.getElementById(numero.concat(NumDiv)))
						{ 
						   
						    //alert(numero.concat(NumDiv));
							SetDiv = document.getElementById(numero.concat(NumDiv));
							//*******************************************************************************
							if ( SetDiv && SetDiv.className != 'cachediv' )
								{
									//DivStatus( nom, NumDiv );
									divID=numero.concat(NumDiv);
									if ( document.getElementById && document.getElementById( divID ) ) // Pour les navigateurs récents
									{
									Pdiv = document.getElementById( divID );
									PcH = true;
									}
									else
									{
									PcH = false;
									}
									if ( PcH )
									{
									Pdiv.className = ( Pdiv.className == 'cachediv' ) ? '' : 'cachediv';
									}
								}
								
								
								while(NumDiv2<12)
								{
									numero=numero.concat(NumDiv);
									numero=numero.concat(NumDiv2);
									//alert(numero);
								    SetDiv = document.getElementById(numero);
									if ( SetDiv && SetDiv.className != 'cachediv' )
								    {
									//DivStatus( nom, NumDiv );
										divID=numero;
										if ( document.getElementById && document.getElementById( divID ) ) // Pour les navigateurs récents
										{
											Pdiv = document.getElementById( divID );
											PcH = true;
										}
										else
										{
											PcH = false;
										}
										if ( PcH )
										{
											Pdiv.className = ( Pdiv.className == 'cachediv' ) ? '' : 'cachediv';
										}
								     }
								     numero="Marke";
									 NumDiv2++;
								}
								NumDiv2=0;
								numero="Marke";
							NumDiv++;
						}
						MarketingEntityStatus=1;
			}
			else
			{
			UpCollaps('MarkeCollaps');
			      while (document.getElementById(numero.concat(NumDiv)))
						{
						
							SetDiv = document.getElementById(numero.concat(NumDiv));
							if ( SetDiv || SetDiv.className != '' )
							{
								
									divID=numero.concat(NumDiv);
									if ( document.getElementById && document.getElementById( divID ) ) // Pour les navigateurs récents
									{
										Pdiv = document.getElementById( divID );
										PcH = true;
									}
									else
									{
										PcH = false;
									}
									if ( PcH )
									{
										Pdiv.className = ( Pdiv.className == 'cachediv' ) ? '' : 'cachediv';
									}
							}
							
							while(NumDiv2<12)
							{
							    numero=numero.concat(NumDiv);
								numero=numero.concat(NumDiv2);
								SetDiv = document.getElementById(numero);
								if ( SetDiv || SetDiv.className != '' )
								{
										divID=numero;
										if ( document.getElementById && document.getElementById( divID ) ) // Pour les navigateurs récents
										{
											Pdiv = document.getElementById( divID );
											PcH = true;
										}
										else
										{
											PcH = false;
										}
										if ( PcH )
										{
											Pdiv.className = ( Pdiv.className == 'cachediv' ) ? '' : 'cachediv';
										}
								}
								numero="Marke";
								NumDiv2++;
							  
							}
							
							
							
							NumDiv2=0;
						    numero="Marke";
							NumDiv++;
						}
						MarketingEntityStatus=0;
			}
			       
		}

A voir également

Vous n'êtes pas encore membre ?

inscrivez-vous, c'est gratuit et ça prend moins d'une minute !

Les membres obtiennent plus de réponses que les utilisateurs anonymes.

Le fait d'être membre vous permet d'avoir un suivi détaillé de vos demandes et codes sources.

Le fait d'être membre vous permet d'avoir des options supplémentaires.