Share
Si vous lisez souvent WebDesignTuts +, vous aurez probablement déjà vu de nombreuses références à ThemeForest, notre marché pour les modèles et les thèmes Web. Cependant, il est également possible que vous ayez visité CodeCanyon, le marché partenaire de ThemeForest, qui propose des extraits de code et des plug-ins. CodeCanyon est une très bonne ressource qui regorge de fichiers utiles, intéressants et, bien, très utiles pour le développement Web, ressources qui pourraient être une ressource inexploitée pour vous..
CodeCanyon couvre un large éventail de catégories différentes, des scripts PHP aux plugins WordPress en passant par le code pour les applications mobiles. Aujourd'hui, nous allons examiner deux catégories spécifiques, HTML5 et CSS, ainsi que des extraits de code attrayants qu'ils contiennent. Si vous avez des favoris supplémentaires de CodeCanyon, déposez des liens dans les commentaires.!
Juste une note avant de commencer, tous les prix ici supposent que vous utilisez des crédits prépayés. Si vous ne souhaitez en acheter qu'un ou deux et ne souhaitez pas investir dans des crédits prépayés, veuillez ajouter 2 $ au prix indiqué. De plus, le nombre d’achats est correct au moment de la rédaction..
Nous allons commencer notre rafle avec des boutons 100% CSS qui ont fière allure. Ces boutons portent le nom approprié, car leur style est similaire à celui du référentiel de code GitHub. Le fichier annonce des "classes faciles", contient un fichier d’aide détaillé et ne coûte que 2 $. Avec 88 achats, ces boutons ont la cote la plus élevée de toute la catégorie CSS avec cinq étoiles complètes.
C'est toujours bien d'écrire des rafles, parce que vous trouvez des trucs très bons. CSS3 Accordions en est un exemple. Il s'agit d'un pack d'accordéons horizontaux et verticaux purement CSS de quatre couleurs. Ce fichier a également une cote de cinq étoiles et un prix de 4 $, offrant une prise en charge des versions de Firefox jusqu’à Firefox 2, et Internet Explorer à IE6 (et bien sûr Opera, Safari et Chrome)..
Ce fichier est un simple lecteur audio optimisé par HTML5 qui lit les fichiers MP3 ou OGG dans tous les principaux navigateurs. Avec l'installation annoncée comme terminée en moins de 3 minutes et dont le fichier javascript ne pèse que 5 Ko, ce fichier à 6 $ est plutôt cool.
Si vous en avez l'occasion, lancez une démonstration de la démonstration en direct pour apprécier la conception réfléchie et la sauvegarde de l'état de votre volume dans plusieurs paramètres..
Ce fichier est un menu CSS3 assez impressionnant avec de grandes icônes qui "HipHop" quand survolé. Il est apparemment facile à mettre en œuvre et peut être limité à l'affichage de l'animation de saut ou à la variation d'éléments de menu non survolés si vous le souhaitez..
En ce qui concerne son utilisation, le menu est un élément de code génial à utiliser sur les sites de portefeuille, en tant que sélecteur de produit ou en tant que concentrateur principal permettant de créer des liens vers des sous-sites. À seulement 2 $, c'est une bonne affaire et je vais probablement l'acheter moi-même une fois que j'aurai fini d'écrire cet article.!
Avant de commencer à écrire pour Tuts +, j'avais initialement prévu de publier certains fichiers sur les places de marché, l'une de mes premières idées étant une série d'effets de survol de l'image. Bien que cette idée ne se soit jamais concrétisée (j'étais trop occupé à écrire sur la validation de formulaire), Pixelworkshop a publié un superbe fichier entre-temps. Le fichier contient 17 effets de survol d'image distincts pour 5 USD, dont des rotations d'image, des superpositions, des rubans et d'autres effets impressionnants. Assurez-vous de visionner l'aperçu vidéo sur celui-ci!
Bien que je ne puisse pas voir une application pour laquelle je pourrais utiliser ce fichier, l'effet qu'il génère est plutôt cool. Docklr CSS reproduit essentiellement les fonctionnalités (agrandissement) du dock sous Mac OS X mais dans une fenêtre de navigateur. Docklr utilise des transitions CSS pour répliquer les animations sous OS X, telles que les icônes qui rebondissent et le grossissement. Pour seulement 4 $, c'est une bonne affaire!
Notification Boxes est essentiellement un groupe de boîtes de notification, construites avec CSS, qui ont fière allure. Ils sont bien conçus, mais comportent également de jolies animations (avec jQuery) quand ils sont licenciés au clic. De plus, Notification Boxes prend en charge les cookies jQuery, ce qui signifie que lorsqu'une notification est rejetée, elle ne réapparaît pas lorsque vous actualisez ou revenez sur la page..
Notification Boxes compte 233 achats et se vend à seulement 2 $.
Pricer est l'une des nombreuses grilles de tarification créées par CSS sur CodeCanyon, et sans doute l'une des meilleures. Pricer utilise uniquement du CSS pur pour créer une grille de comparaison des prix permettant de comparer différents plans pour un hôte Web ou plusieurs niveaux d’adhésion. Bien qu'il n'y ait pas de prévisualisation vidéo, la liste promet des animations basées sur CSS dans les navigateurs pris en charge (Safari 4+, Chrome 4+, Opera 10.5+, Firefox 4+) avec une "dégradation progressive" dans les anciens navigateurs..
Avec 13 combinaisons de couleurs différentes, Pricer affiche un prix minimum de 3 $.
Je n'ai pas mentionné les menus déroulants pour accéder au monstre des ventes "CSS3 Mega Drop Down Menu" de Pixelworkshop (le créateur de "CSS3 Image Hover Effects")..
Avec 3836 ventes, ce fichier est le plus acheté sur l’ensemble du marché CodeCanyon. Fondamentalement, il s’agit d’un menu déroulant valide alimenté par CSS3, prenant en charge plusieurs navigateurs dans neuf couleurs. Le fichier a une tonne d'options pour la personnalisation, c'est donc vraiment quelque chose à regarder, bien que vous puissiez ressentir le besoin d'ajouter votre propre CSS dans pour affiner un peu la conception.
Ce fichier à 4 dollars contient onze ombres de génération CSS, y compris les ombres en chaîne, en survol et en pli, qui ont l’air génial. C'est l'un de ces fichiers simples qu'il est toujours utile d'avoir dans votre arsenal, et cela ne coûte pas très cher de le faire..
La pagination peut parfois être sous-estimée, mais elle fournit en fait une navigation essentielle vers un blog. "CSS Pagination Pack" est un ensemble d'éléments de pagination basés sur CSS, disponibles en sept couleurs..
Cette pagination à 2 $ est générée avec un code sémantique simple à comprendre. Le fichier est livré avec une documentation complète si vous avez besoin d’aide, mais l’exemple d’utilisation simple fourni dans la description de l’article est tout ce dont vous avez réellement besoin..
Il est difficile d'ignorer la qualité incroyable de ce fichier qui génère de très beaux graphiques à barres avec du CSS et du HTML purs, ainsi que des états de survol. Les graphiques résultants ne sont certainement pas inférieurs étant donné qu’ils n’utilisent aucune image. Franchement, 3 $ est une bonne affaire pour un dossier aussi volumineux!
Galerie vidéo HTML5 avec liste de lecture en direct est un lecteur vidéo HTML5 agréable à vivre et bien animé qui contient également un composant liste de lecture. Le fichier fonctionne avec les fichiers OGV et MP4 et contient même un repli Flash pour les navigateurs qui ne prennent pas en charge la vidéo HTML5. Je peux également confirmer que le fichier fonctionne parfaitement sur un iPad!
La galerie vidéo HTML5 avec une playlist en direct coûte 8 USD chez CodeCanyon.
Elitepack Classic CSS3 Tags est un pack de styles bien conçus pour les balises post, compatibles avec tous les navigateurs. Venant dans plusieurs couleurs différentes, avec des états de survol et une implémentation sémantique, le fichier est très joli.
Elitepack Classic CSS3 Tags est étiqueté (sans jeu de mots!) Avec juste un prix de 3 $.
Comme vous pouvez le constater, CodeCanyon contient des fichiers de code CSS et HTML5 très intéressants qui pourraient très bien fonctionner pour un projet actuel ou futur. Cependant, ce n'est certainement pas la limite de ce que propose CodeCanyon, alors assurez-vous de parcourir ses archives.
Si vous avez d'autres fichiers CodeCanyon préférés, assurez-vous de les partager dans les commentaires.!
Accentsconagua