Il nous arrive tout le temps de vouloir transformer un tableau en plusieurs divs surtout pour ceux qui font dans le responsive design.
J'ai créé un plugin Jquery pour le faire. TableToDivReplace
TableToDivReplace est un plugin basé sur jQuery qui transforme une table en une suite de blocs pouvant ainsi faciliter l'adaptation sur différent média.
L'utilisation est assez simple.
Après avoir crée votre table et une fois la dom chargé,
il suffit d'appeler TableToDivReplace sur les tables dont vous voulez transformer.
<script>
$("table#table").TableToDivReplace();
</script>
Cet exemple transforme uniquement la table ayant pour id "table" en plusieurs div
or
<script>
$("table").TableToDivReplace();
</script>
Transforme toutes les tables de la dom en divs.
Vous pouvez le télécharger ici.
Bonne utilisation!!!!
vendredi 21 mars 2014
mardi 18 mars 2014
Personnaliser les alert() en javascript
Personnaliser les alert() en javascript
Il nous est plusieurs fois arrivé de vouloir personnaliser ces foutu alert() généré par le navigateur.J'ai écrit aujourd'hui un script pour le faire. il est simple et "customisable"(personnalisable)
Utilisation
- Cas de base
<!doctype>
<html>
<head>
<link rel="stylesheet" href="alert.css" />
<script type="text/javascript" src="alert.js"></script>
</head>
<body>
<script>
alert('Boite de dialogue,<br>sans evennement onclick <br>!');
</script>
</body>
</html>
ce petit bout de code transformera toute vos boite d'alert() en ceci (par défaut )tout en sachant qu'il est personnalisable.
2. Personnalisation
Pour changer la couleur de fond de la boite de dialogue il suffit de modifier les valeurs la variable des configurations de l’alerte en faisant par exemple ceci:
//alertConfig est une variable prédéfinie.
alertConfig={
boxBgColor:"red" // ou bien toute autre couleur #aaccee par exemple
};
alert('Boite de dialogue,<br>sans evennement onclick <br>!');
</script>
et en fin pour changer complètement
<script>
alertConfig={
boxBgClass:"myButton", //Background class
boxBgColor:"red",
boxBtnCloseClass:"myButton", //Button close class
};
alert('Boite de dialogue,<br>sans evennement onclick <br>!');
</script>
Vous pouvez le télécharger ici.
Inscription à :
Articles (Atom)