Faire clignoter en fondu une image dans une page html vierge et qui se positionne correctement par rapport au background
2 participants
Forum gratuit : Le forum des forums actifs :: Entraide & Support... :: Problème avec un script, un code :: Archives des problèmes avec un code
Page 1 sur 1 • Partagez
Faire clignoter en fondu une image dans une page html vierge et qui se positionne correctement par rapport au background
- Code:
<style>
body{
background-position:center bottom;
background-size: cover;
background-color: #000000;
background-image: url(http://i84.servimg.com/u/f84/18/73/48/08/blason11.png), url(http://i84.servimg.com/u/f84/18/73/48/08/sceau10.png);
background-repeat: no-repeat, no-reapeat;
}</style>
Coucou, j'ai besoin d'aide pour faire clignoter en fondu une image (le blason vert et jaune) dans une page html vierge et que cette image se positionne correctement par rapport au background (jardin).
J'ai essayé plusieurs choses mais je n'arrive pas.
Merci par avance.
Édition :
Je pense faire une image animée si la première idée ne trouve pas de solution seulement j'ai besoin de savoir comment faire pour superposer une image sur le background et qu'à toutes les résolutions l'image suit le même mouvement car je ne sais pas faire les images animées en fond transparent.
Dernière édition par Guilde-Egregore le Jeu 25 Fév 2016, 15:32, édité 1 fois
Re: Faire clignoter en fondu une image dans une page html vierge et qui se positionne correctement par rapport au background
J'ai trouvé un code pour faire clignoter l'image mais problème il ne fonctionne pas sur une page html qui ne contient pas le haut et le bas du forum (alors qu'il fonctionne sur les autres pages).
Aussi j'ai pensé à un moyen pour centrer l'image par rapport au background qui est la marge mais ça ne fonctionne pas bien car mon background est en cover et positionné center bottom.
Je souhaite vraiment trouver.
Aussi j'ai pensé à un moyen pour centrer l'image par rapport au background qui est la marge mais ça ne fonctionne pas bien car mon background est en cover et positionné center bottom.
Je souhaite vraiment trouver.
Re: Faire clignoter en fondu une image dans une page html vierge et qui se positionne correctement par rapport au background
Coucou !
Si vous ne comprenez pas ma demande je peux réexpliquer ? :/
Si vous ne comprenez pas ma demande je peux réexpliquer ? :/
Re: Faire clignoter en fondu une image dans une page html vierge et qui se positionne correctement par rapport au background
Bonsoir,
La page ne doit comporter qu'une image de fond et une image clignotante
Les deux doivent s'adapter à la résolution de l'écran ... c'est ça ?
La page ne doit comporter qu'une image de fond et une image clignotante
Les deux doivent s'adapter à la résolution de l'écran ... c'est ça ?
- Code:
<!DOCTYPE html>
<html>
<head>
<style>
body{
background-position:center;
background-size: cover;
background-color: #000000;
background-image: url(http://i84.servimg.com/u/f84/18/73/48/08/sceau10.png);
background-repeat: no-repeat;
}
img{
width:100%;
-webkit-animation-name: blinker;
-webkit-animation-duration: 2s;
-webkit-animation-timing-function: linear;
-webkit-animation-iteration-count: infinite;
-moz-animation-name: blinker;
-moz-animation-duration: 2s;
-moz-animation-timing-function: linear;
-moz-animation-iteration-count: infinite;
animation-name: blinker;
animation-duration: 2s;
animation-timing-function: linear;
animation-iteration-count: infinite; color: red;
}
@-moz-keyframes blinker {
0% { opacity: 1.0; }
50% { opacity: 0; }
100% { opacity: 1.0; }
}
@-webkit-keyframes blinker {
0% { opacity: 1.0; }
50% { opacity: 0; }
100% { opacity: 1.0; }
}
@keyframes blinker {
0% { opacity: 1.0; }
50% { opacity: 0; }
100% { opacity: 1.0; }
}
</style>
</head>
<body>
<img src="http://i84.servimg.com/u/f84/18/73/48/08/blason11.png" />
</body>
</html>
Re: Faire clignoter en fondu une image dans une page html vierge et qui se positionne correctement par rapport au background
Exactement ! Dans le mille merci ça va beaucoup m'aider pour la suite !
Je pensais à quelque chose sans barre de défilement verticale avec le background "center center" mais je ne vais pas être trop exigent non plus ! Et puis j'ignore si c'est possible !
J'ai trouvé le moyen d'ajouter un icon dans l'onglet mais pas le titre avec vous une idée ?
Merci à vous pour votre aide !
Je pensais à quelque chose sans barre de défilement verticale avec le background "center center" mais je ne vais pas être trop exigent non plus ! Et puis j'ignore si c'est possible !
J'ai trouvé le moyen d'ajouter un icon dans l'onglet mais pas le titre avec vous une idée ?
Merci à vous pour votre aide !
Re: Faire clignoter en fondu une image dans une page html vierge et qui se positionne correctement par rapport au background
En plaçant des balises title entre les balises head ...
- Code:
<!DOCTYPE html>
<html>
<head>
<title>Lieu du Blason</title>
<link type="image/x-icon" rel="shortcut icon" href="http://i18.servimg.com/u/f18/18/73/48/08/110_1110.png" />
<style>
body{
background-position:center center;
background-size: cover;
background-color: #000000;
background-image: url(http://i84.servimg.com/u/f84/18/73/48/08/sceau10.png);
background-repeat: no-repeat;
}
img{
width:100%;
-webkit-animation-name: blinker;
-webkit-animation-duration: 2s;
-webkit-animation-timing-function: linear;
-webkit-animation-iteration-count: infinite;
-moz-animation-name: blinker;
-moz-animation-duration: 2s;
-moz-animation-timing-function: linear;
-moz-animation-iteration-count: infinite;
animation-name: blinker;
animation-duration: 2s;
animation-timing-function: linear;
animation-iteration-count: infinite; color: red;
}
@-moz-keyframes blinker {
0% { opacity: 1.0; }
50% { opacity: 0; }
100% { opacity: 1.0; }
}
@-webkit-keyframes blinker {
0% { opacity: 1.0; }
50% { opacity: 0; }
100% { opacity: 1.0; }
}
@keyframes blinker {
0% { opacity: 1.0; }
50% { opacity: 0; }
100% { opacity: 1.0; }
}
</style>
</head>
<body>
<img src="http://i84.servimg.com/u/f84/18/73/48/08/blason11.png" />
</body>
</html>
Re: Faire clignoter en fondu une image dans une page html vierge et qui se positionne correctement par rapport au background
Merci à vous Scoubifitz cela me convient !
Bon après-midi !
Bon après-midi !
Sujets similaires
» Code HTML qui ne s'affiche pas correctement dans les messages
» Text Input "{USERNAME}" dans une page HTML vierge.
» Comment faire disparaitre un "rectangle" vierge se trouvant sur ma page d'accueil ?
» Comment mettre une image URL dans une page HTML?
» mettre image de fonds dans une page HTML
» Text Input "{USERNAME}" dans une page HTML vierge.
» Comment faire disparaitre un "rectangle" vierge se trouvant sur ma page d'accueil ?
» Comment mettre une image URL dans une page HTML?
» mettre image de fonds dans une page HTML
Forum gratuit : Le forum des forums actifs :: Entraide & Support... :: Problème avec un script, un code :: Archives des problèmes avec un code
Page 1 sur 1
Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum