Wavebox v1.1, la slidebar sexy

Télécharger le projet
Commenter

Description

Wavebox est une slidebar légère en ressources qui ne requière aucune librairie javascript. Son utilisation est très simple et le script fonctionne dans tous les navigateurs modernes. Tous les aspects visuels sont spécifiés dans le fichier CSS.

Faites moi part de vos commentaires et n'oubliez pas de me donner une note. C'est mon premier code en javascript, c'est donc important pour moi!

Merci

Plus d'infos sur http://drawave.bplaced.net/wavebox.php

Source / Exemple : 


// -------------------------------------------
// Wavebox v1.1
// By drawave - http://www.drawave.bplaced.net
// -------------------------------------------

// Move
function move(target){	
	if(width<target){ 
		k=Math.min(k+=0.05, Math.PI/2);
		width=Math.sin(k)*boxmax;
		box.style.width=width+'px';
	}
	if(width>target){
		k=Math.max(k-=0.05,0);
		width=Math.sin(k)*boxmax;
		box.style.width=width+'px';
	}
	if(width==target){
		window.clearInterval(timer);
	}
}

// Open
function boxopen(){
	if(moving){
		window.clearInterval(timer);
	}
	box.className='back';
	moving=true;
	timer=window.setInterval('move(boxmax)',1);
}

// Close
function boxclose(){
	if(moving){
		window.clearInterval(timer);
	}	
	box.className='open';
	moving=true;
	timer=window.setInterval('move(boxmin)',1);
}

// Wavebox
window.onload = function(){
	box=document.getElementById('wavebox');
	size=box.clientHeight;
	boxmax=box.clientWidth-size;	
	k=width=boxmin=0;
	box.style.width=width+'px';
	box.className='open';
	moving=false;	
	timer=false;
	box.onmouseover = boxopen;
	box.onmouseout = boxclose;
}

Conclusion :


Plus d'infos sur http://drawave.bplaced.net/wavebox.php
Télécharger le projet

Codes Sources

S'inscrire maintenant

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.