Résolu bande annonce défilante dans header

oui tu as raison; je pensais à un truc mais il faut un texte fixe donc....

Merci encore

Bonne soirée

Cordialement 

Bonjour Jolad et Colette 95

A part rectangle il n'y a rien de possible ?

Essayez cette version du code (dans le blog de démo par exemple):

.defilant {
    position: absolute;
    top: 30px;
    left: 80px;
    border: 20px double #465B77;
    border-radius: 100px 10px 0px 0px;
    background: #E8E9EB none repeat scroll 0% 0%;
    padding-top: 70px;
}


<div class="defilant"><marquee style="width: 100px; height: 100px;" scrollamount="3"><span style="color: #800000; font-size: 18pt; ">Excellentes f&ecirc;tes de fin d'ann&eacute;e M&eacute;di&eacute;vale.</span></marquee></div>

.. perso, c'est un peu une surprise de pouvoir "habiller le marqee" par css . .

Bonjour Stormalo,

Merci bpc pour l'info.

J'ai fait l'essai à l'instant et le rendu n'est pas super ! Je reste donc avec mon rectangle

Bonne journée 

Cordialement

Bonjour stormalo.

Mais bon, comme tu renchéris , voici ma petite version "fêtes de fin d'année", à mettre évidemment sur un fond plutôt foncé ou sinon modifier les couleurs.

<div class="defilant"><span class="fond"><img style="position: absolute; margin: -30px 0 0 -60px;" src="http://ekladata.com/5sGidGnnVtxvuFUAk12_QhvbGOY/sapin.png" alt="" width="60" /><marquee scrollamount="3"><span style="color: #800000; font-size: 18pt;">Excellentes f&ecirc;tes de fin d'ann&eacute;e M&eacute;di&eacute;vale.</span></marquee></span></div>

<style><!--
.defilant { 
position: absolute; 
top: 30px; 
left: 80px; 
border-bottom: 80px double white; 
border-left: 80px solid transparent; 
border-right: 80px solid transparent; 
height: 0;
line-height: 40px;
width: 150px;
}
.fond {
position: absolute;
background: red;
width: 150px;
height: 40px;
margin-top: 27px;
}
--></style>

Bonne journée.

Bonjour Colette,

Je viens mettre mon petit grain de sel: le sapin est une excellente idée mais lorsque j'ajoute du CSS, même en faisant un copier/coller, on me dit qu'il y a une erreur et comme je n'y connais quasiment rien...

C'est normal car tu as déjà mis dans dans ton css   :

/*.defilant {
 position: absolute;
 top: 30px;
 left: 80px;
 border: 6px solid #465B77; /*ma bordure*/
 border-radius: 6px; /*coins arrondis*/ 
 background: #e8e9eb;
}*/

et tu ne peux utiliser 2 fois .defilant en lui attribuant des valeurs différentes.

Donc, soit tu le supprimes tout simplement ou le neutralises en ajoutant ce que j'ai mis en rouge.

Ensuite il ne te reste plus qu'à copier/coller l'intégralité des codes dans ton module (mode html bien sûr).

Je ne comprends plus rien. Alors j'ai mis ceci dans le module html: <div class="defilant"><span class="fond"><img style="position: absolute; margin: -30px 0 0 -60px;" src="http://ekladata.com/5sGidGnnVtxvuFUAk12_QhvbGOY/sapin.png" alt="" width="60" /><marquee scrollamount="3"><span style="color: #800000; font-size: 18pt;">Excellentes f&ecirc;tes de fin d'ann&eacute;e M&eacute;di&eacute;vale.</span></marquee></span></div>

J'ai donc le sapin et le rectangle et le texte.

Alors maintenant qu'est ce que je dois mettre dans le CSS pour ne plus avoir de rectangle (uniquement le sapin et le texte)?

Houlala, je suis plutôt bornée.....

Si tu ne veux plus que le texte défilant et le sapin, alors la question n'est plus ce que tu dois mettre dans le css, mais plutôt ce que tu dois enlever et en fin de compte, tes codes se résument maintenant à :

<div class="defilant"><img style="position: absolute; margin: -30px 0 0 -60px;" src="http://ekladata.com/5sGidGnnVtxvuFUAk12_QhvbGOY/sapin.png" alt="" width="60" /><marquee scrollamount="3"><span style="color: #800000; font-size: 18pt;">Excellentes f&ecirc;tes de fin d'ann&eacute;e M&eacute;di&eacute;vale.</span></marquee></div>

<style><!--

.defilant {

  width: 150px; /*largeur de la bande de défilement*/

  position: absolute;

  top: 30px; /*positionnement haut du blog*/

  left: 80px; /*positionnement gauche du blog*/

 }

--></style>

Toutes les valeurs en bleu sont à adapter et pour le sapin, il vaut mieux que tu le télécharges sur ton blog et modifier son url car je ne garantie pas sa sauvegarde dans mes fichiers.

Et bien sûr, comme déjà dit, la meilleure des écoles, c'est de faire des essais pour comprendre. 

Bonne soirée.

Bonjour Colette 95,

Je sais bien que la meilleure des écoles est d'essayer mais pour ce type de truc, je ne suis pas à l'aise du tout pour la simple et bonne raison, c'est que je n'y connais rien ou tellement peu de choses et j'avoue que pour moi c'est plutôt abstrait!!!! Mais je commence à entrevoir le début du début du début......

je vais donc, comme une bonne écolière enregistrer tout ce que tu m'as écrit et faire des essais sur le blog d'essai.

Dernière question avant de te  "libérer": je peux donc insérer n'importe quelle image dans mon bandeau?

Encore merci pour ton aide qui m'a été très précieuse et te souhaite d'excellentes fêtes de fin d'année

Cordialement  

Que veut dire marquee?

Bonjour Jolad,

Oui tu peux mettre l'image que tu veux. 

Et pour marquee c'est une balise qui permet de faire défiler du texte ou des objets, mais tout cela c'est du jargon informatique...   

Je te mets un lien qui t'en dira un peu plus sur ce qui peut être réalisé avec, mais tu peux en trouver d'autres en tapant dans ton moteur de recherche "balise marquee" :

http://www.jecreemonsite.net/html_css/marquee.php

PS : Il faut savoir que ces codes sont complètement obsolètes et ne devraient plus être utilisés, mais bon, tant que ça fonctionne... 

Bonne Fêtes à toi également.