Effet surbrillance sur une image survolée
nistarok
Messages postés
304
Date d'inscription
Statut
Membre
Dernière intervention
-
mr_demonicon Messages postés 828 Date d'inscription Statut Membre Dernière intervention -
mr_demonicon Messages postés 828 Date d'inscription Statut Membre Dernière intervention -
Bonjour,
sur mon site web, j'ai des images qui redirigent vers une autre page lorsque l'on clique dessus (images cliquables).
Je souhaite simplement rajouter un effet, c'est à dire mettre l'image en surbrillance et avec effet de relief lorsque je survole celle-ci.
Je précise j'utilise Joomla 2.5.
Merci !
sur mon site web, j'ai des images qui redirigent vers une autre page lorsque l'on clique dessus (images cliquables).
Je souhaite simplement rajouter un effet, c'est à dire mettre l'image en surbrillance et avec effet de relief lorsque je survole celle-ci.
Je précise j'utilise Joomla 2.5.
Merci !
A voir également:
- Effet surbrillance sur une image survolée
- Effet miroir word - Guide
- Image iso - Guide
- Légender une image - Guide
- Comment rechercher une image sur google - Guide
- Mettre une image en filigrane sur word - Guide
3 réponses
par exemple
Bonne continuation et n'oubliez pas le risque zéro c'est dans vos rêves.
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
.imgBox
{
width: 441px;
height: 248px;
background: url([http://www.corelangs.com/css/box/img/water.jpg)no-repeat;]
}
.imgBox:hover
{
-moz-box-shadow: 0 0 10px #ccc;
-webkit-box-shadow: 0 0 10px #ccc;
box-shadow: 0 0 10px #ccc;
}
</style>
</head>
<body>
<div class="imgBox"> </div>
</body>
</html>
Bonne continuation et n'oubliez pas le risque zéro c'est dans vos rêves.
merci demonicon !
Bon je sais que tu n"utilises pas joomla, et je dois traiter une 40 de photos.
Je me demande, il n'y aurait pas moyen de faire plus simple ? Genre créer une class " photo " en html et de rajouter ce code dans la feuille de css ?
Ah et un dernier truc, les navigateurs ont pas de problème à interpréter ce code ?
Thx !
Bon je sais que tu n"utilises pas joomla, et je dois traiter une 40 de photos.
Je me demande, il n'y aurait pas moyen de faire plus simple ? Genre créer une class " photo " en html et de rajouter ce code dans la feuille de css ?
Ah et un dernier truc, les navigateurs ont pas de problème à interpréter ce code ?
Thx !
donc j'ai testé ça, et ça ne marche pas. Il ne me le retient pas en mémoire :
<p><a href="index.php/instrument/16-les-batteries-acoustiques-sous-cat">
<img src="images/batterie-acoustique-cat.jpg" border="0" alt="" /></a>
<style type="text/css">
.imgBox
{
width: 580px;
height: 300px;
background: url[(".../images/batterie-acoustique-cat.jpg")no-repeat;]
}
.imgBox:hover
{
-moz-box-shadow: 0 0 10px #ccc;
-webkit-box-shadow: 0 0 10px #ccc;
box-shadow: 0 0 10px #ccc;
}
</style>
</p>
Pour le CSS il ne s'insère pas comme ça, il faut le mettre dans la feuille de style qui est charrgée par la page.
Il me semble déjà vous avoir vu poster ici, il serait grand temps d'apprendre les bases de la création des pages web si vous en faites.
D'ailleurs que vous utilisiez un CMS ou n'importe quelle autre méthode cela est indispensable, le CMS permet d'utiliser des pages toutes faites(les templates) mais n'utilise pas des technologies différentes, il est beaucoup moins performant et efficace (qu'un site fait soi même) mais nécessite moins de connaissances, notamment en programmation et base de données.
Pour le reste c'est l'affichage et la mise en page d'une page, donc HTML et CSS qui sont beaucoup plus simple à utiliser que word.
Il me semble déjà vous avoir vu poster ici, il serait grand temps d'apprendre les bases de la création des pages web si vous en faites.
D'ailleurs que vous utilisiez un CMS ou n'importe quelle autre méthode cela est indispensable, le CMS permet d'utiliser des pages toutes faites(les templates) mais n'utilise pas des technologies différentes, il est beaucoup moins performant et efficace (qu'un site fait soi même) mais nécessite moins de connaissances, notamment en programmation et base de données.
Pour le reste c'est l'affichage et la mise en page d'une page, donc HTML et CSS qui sont beaucoup plus simple à utiliser que word.
la balise style se met dans le <head> svp
sinon tu met la class="photo" a tout tes objets et tu met .photo { tes parametres} et tu auras cet effet css sur toute
Bonne continuation et si tu as des problemes regarde les tutoriels sur le cs et html comme openclassroom et autres ^^.
Bonne journée
(et c'est pas vrai le truc avec word est plus facile qu'avec css et html car il faut un minimum de connaissance pour faire du html et le resultat n'est pas parfait alors qu'avec word tout est bien fait et y a pas de probleme
sinon tu met la class="photo" a tout tes objets et tu met .photo { tes parametres} et tu auras cet effet css sur toute
Bonne continuation et si tu as des problemes regarde les tutoriels sur le cs et html comme openclassroom et autres ^^.
Bonne journée
(et c'est pas vrai le truc avec word est plus facile qu'avec css et html car il faut un minimum de connaissance pour faire du html et le resultat n'est pas parfait alors qu'avec word tout est bien fait et y a pas de probleme