DIV qui change de couleur

Répondre


Cette question est un moyen d’empêcher des soumissions automatisées de formulaires par des robots.
Smileys
:D :) :( :o :shock: :? 8-) :lol: :x :P :oops: :cry: :evil: :twisted: :roll: :wink: :!: :?: :idea: :arrow: :| :mrgreen: =D> #-o =P~ :^o :non: :priere: 8-|
Voir plus de smileys
  Revue du sujet
 

  Étendre la vue Revue du sujet : DIV qui change de couleur

Re: DIV qui change de couleur

par pereablanco » 10 janv. 2014, 19:49

Merci pour ton aide (encore une fois), je vais tester ça. Je vous fais le retour au plus vite

Re: DIV qui change de couleur

par nico63800 » 08 janv. 2014, 10:20

Bonjour,

voilà un exemple que j'ai mis en ligne pour test:
http://nico63800.byethost10.com/div.php

le code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<title>titre de la page</title>

<style type="text/css">
.global{
width: 900px;
min-height: 100px;
overflow: hidden;
background-color: yellow;
}
.part{
float:left;
margin-left: 10px;
width: 280px;
height: 150px;
background-color: grey;

transition:background .2s;-webkit-transition:background .2s;-moz-transition:background .2s;-ms-transition:background .2s;
}

.part:hover{background : red;}
</style>
</head>

<body>
<div class="global">
<div class="part">ma div 1 de 280 pixels</div>
<div class="part">ma div 2 de 280 pixels</div>
<div class="part">ma div 3 de 280 pixels</div>
</div>
</body>
</html>

l'espacement entre les div est assuré avec le margin-left à 10px

Re: DIV qui change de couleur

par niuxe » 07 janv. 2014, 21:06

onmouseover pour un background :shock: . C'est du n'importe quoi !

En CSS !
div{background : blue;transition:background .2s;-webkit-transition:background .2s;-moz-transition:background .2s;-ms-transition:background .2s;}

div:hover{background : red;}

Re: DIV qui change de couleur

par pereablanco » 06 janv. 2014, 22:39

Merci pour votre aide

juste une dernière question,

[javascript]<div style="width:300px; height:600px; border:solid 1px black; text-align:center;"
onmouseover="this.innerHTML='Dedans'; this.style.backgroundColor='#87CEFA';"
onmouseout="this.innerHTML='Dehors'; this.style.backgroundColor='lightgrey';">
</div>[/javascript]

Sur cet exemple de javascript, comment puis-je en aligner trois (div) l'une apres l'autre et en les espacent de 10 pixels environ. Sans retourner à la ligne (dans la limite de ma lrgeur de page, disons 900 pixels)

Une div, un espace, une div, un espace et une div


Merci Benv8nam

Re: DIV qui change de couleur

par benv8nam » 06 janv. 2014, 22:31

C'est compatible sur tous les navigateurs récent (après IE7).

Re: DIV qui change de couleur

par pereablanco » 06 janv. 2014, 22:28

Regarde à cette page il y a un exemple de ce que tu veux faire.

http://www.startyourdev.com/html/evenem ... nmouseover

Je n'avais pas vu merci pour le lien.
Avec ce javascrit pensez-vous qu'il serait compatible avec la plupart des navigateurs (safari, IE...) ?

Re: DIV qui change de couleur

par pereablanco » 06 janv. 2014, 22:26

Tu peux utiliser du javascript onmouseover, onmouseout
j'ai oublié de préciser mon niveau de Poulpe en la matière lol. Sur Dreamweaver j'arrive à le faire avec des images mais pas avec une div et une couleur #0000000

Par exemple si je veux 3 div les une après les autres :

Image

Re: DIV qui change de couleur

par benv8nam » 06 janv. 2014, 22:25

Regarde à cette page il y a un exemple de ce que tu veux faire.

http://www.startyourdev.com/html/evenem ... nmouseover

Re: DIV qui change de couleur

par pereablanco » 06 janv. 2014, 22:22

Tu peux utiliser du javascript onmouseover, onmouseout
j'ai oublié de préciser mon niveau de Poulpe en la matière lol. Sur Dreamweaver j'arrive à le faire avec des images mais pas avec une div et une couleur #0000000

Re: DIV qui change de couleur

par benv8nam » 06 janv. 2014, 21:39

Tu peux utiliser du javascript onmouseover, onmouseout

DIV qui change de couleur

par pereablanco » 06 janv. 2014, 21:21

Bonjour,

Je suis débutant, j'ai conçu moi même mon site. Mais je n'arrive pas a créer un effet.
Je souhaiterai que lorsque la sourie passe sur une div, elle change de couleur (l'arrière plan par exemple,). J'avais mis la main sur une ligne de code mais cette dernière fait l'effet que sur le lien hypertexte.

Merci par avance de votre aide


Meilleurs voeux