Petit code alliant canvas & JavaScript ! 🙂
Développement Web
Tri JS
Pour trier une galerie en fonction de thèmes définis. 😉
Clock
Nouveau test de Javascript sur les fonctions date, totalement responsive ! 🙂
StarSky
http://codepen.io/Kalhenyan/pen/AXbqmY
Petit essai de Javascript avec des étoiles ! 😀
Uploadé sur CodePen, vous pouvez d’ailleurs y retrouver mes autres (petits) projets en code. 🙂
Mon CodePen
Only CSS
Test d’animations/keyframes CSS. 🙂
Mouvement automatique
Survol -> carrés (annulation du border-radius)
Colors JS
Petit script pour trouver une couleur en RGB. 🙂
Click gauche pour augmenter la valeur / droit pour diminuer.
Version rgba : Color JS Opacity
Nifty Modal Window Effects
New Portfolio
Hop ! Voici une base en HTML/JS pour mon prochain portfolio. 🙂
N’hésitez pas à commenter pour améliorations, idées, etc.
Comme il reste encore pas mal de bugs…
Rotate JS
Petite fonction de rotation en Javascript. 😉
Il suffit de déplacer le curseur pour faire varier la vitesse de rotation.
var rotateSquare = function(n) {
var divs = document.getElementsByTagName(« div »);
for (var i = 0; i < divs.length; i++) {
divs[i].style.WebkitTransform = « rotate( » + n + « deg) »;
divs[i].style.msTransform = « rotate( » + n + « deg) »;
divs[i].style.transform = « rotate( » + document.count + « deg) »;
}
document.count = document.count + 10;
};
Hello JS
Petit test pour une fonction variant l’opacité. 😉
JS
var opacity = function(node, n) {
function animBoxY(){
if(node.style.opacity > 0){
node.style.opacity = parseFloat(node.style.opacity) – 0.1;
console.log(node.style.opacity);
}
}function animBoxN(){
if(node.style.opacity <= 1){
console.log(node.style.opacity);
node.style.opacity = parseFloat(node.style.opacity) + 0.1;
console.log(node.style.opacity);
}
}if (n == 1) {
node.style.opacity = 1;
setInterval(animBoxY, 100);
}
if (n == 2) {
node.style.opacity = 0;
setInterval(animBoxN, 100);
}}
// Appel
opacity(element, 1_ou_2);