comment rajouter des lettres

[laroute]

bonjour

comment peut on placé d'autre lettres pour écrire BONNE et ANNEE je n'ai pu que placer le B de bonne et le E de année pouvez m'expliquer comment on procedent ne voulant pas a chaque fois vous dérangez

photo si dessous




en vous remerciant
cordialement

ps: j'aurai peut etre du poster ce message dans: gerer l'apparence de votre forum

[Invité]

Hello laroute,

tu peux le faire avec un simple script et des lettres et ensuite tu colorises le tout.

Modules/HTML&JAVASCRIPT/Gestion des codes Javascript/Codes Javascript



Mets un titre explicite.
Cocher sur toutes les pages.




Déposes ceci:

Code:


$(function(){
$('<div class="M14_Happy_New_Year"><span>B</span><span>O</span><span>N</span><span>N</span><span>E</span><span>A</span><span>N</span><span>N</span><span>E</span><span>E</span></div>').insertAfter('div[id="page-header"] .navbar');
});


Penses a cliquer sur le bouton VALIDER

Puis un peu de style:
Dans la feuille de style:
Affichage/Images et Couleurs/Couleurs/Feuille de style

Ajoutes ceci:

Code:


.M14_Happy_New_Year{text-align:center;height:60px;border:3px dotted darkred;background-color:white;}
.M14_Happy_New_Year span{font-size:60px; color:darkblue;line-height:60px;font-weight: bold;margin: 0px 20px;}


Penses à cliquer sur le bouton


Les lettres sont présentes dans le script ici entre chaque balise span:

Code:

<div class="M14_Happy_New_Year">
<span>B</span>
<span>O</span>
<span>N</span>
<span>N</span>
<span>E</span>
<span>A</span>
<span>N</span>
<span>N</span>
<span>E</span>
<span>E</span>
</div>


Si tu désires afficher que des images (je suppose) il faudra supprimer toutes les balises spans et insérer le lien des images.
un peu comme ceci:

Code:


$(function(){
$('<div class="M14_Happy_New_Year">
<img src="LIEN DE L IMAGE B"/></img>
<img src="LIEN DE L IMAGE O"/></img>
<img src="LIEN DE L IMAGE N"/></img>
<img src="LIEN DE L IMAGE N"/></img>
<img src="LIEN DE L IMAGE E"/></img>

<img src="LIEN DE L IMAGE A"/></img>
<img src="LIEN DE L IMAGE N"/></img>
<img src="LIEN DE L IMAGE N"/></img>
<img src="LIEN DE L IMAGE E"/></img>
<img src="LIEN DE L IMAGE E"/></img>
</div>').insertAfter('div[id="page-header"] .navbar');
});


Ce style ne sera donc plus utile:

Code:

.M14_Happy_New_Year span{font-size:60px; color:darkblue;line-height:60px;font-weight: bold;margin: 0px 20px;}

a++

[laroute]

bonjour et merci Milouze pour ton aide mais cela ne fonctionne pas

je depose ton premier lien dans javascript valider
ensuite le deuxieme lien dans css valider
quand je reviens dans javascript je n'ai pas le lien "span" faut'il le rajouter

[Invité]

Hello laroute,
oups boulette de ma part.

Il faut bien renseigner tous les liens des images,
dans le script suivant, j'ai déposé la même lettre , il faudra donc les modifier.
Remplaces donc celui donné plus(avec une correction de ma part) :

Code:

$(function(){
$('<div class="M14_Happy_New_Year"><img src="https://i.servimg.com/u/f85/14/19/26/38/alpha_26.gif"/><img src="https://i.servimg.com/u/f85/14/19/26/38/alpha_26.gif"/><img src="https://i.servimg.com/u/f85/14/19/26/38/alpha_26.gif"/><img src="https://i.servimg.com/u/f85/14/19/26/38/alpha_26.gif"/><img src="https://i.servimg.com/u/f85/14/19/26/38/alpha_26.gif"/><img src="https://i.servimg.com/u/f85/14/19/26/38/alpha_26.gif"/><img src="https://i.servimg.com/u/f85/14/19/26/38/alpha_26.gif"/><img src="https://i.servimg.com/u/f85/14/19/26/38/alpha_26.gif"/></div>').insertAfter('div[id="page-header"] .navbar');
});

Et la css modifiée( donc a remplacer) :

Code:

.M14_Happy_New_Year{text-align:center;height:85px;border:3px dotted darkred;}
.M14_Happy_New_Year img{margin:5px 10px 5px 10px; }

Si tu n'y arrives pas avec les images, merci de me donner tous les liens ici et je te le ferais,
si te souhaites.

a++

[laroute]

Bonjour Milouze

j'ai enfin réussi le souci était que sur ta démonstration les liens pour les photos dans le script etaient l'un sur l'autre et moi ils apparaissaient l'un a la suite de l'autre donc je les repositionnais comme les tiens pour plus de facilité a les modifié et une fois remis l'un a la suite de l'autre c'est nickel.
Une autre question est il possible de les positionner dans l'emplacement que j'ai indiqué en rouge avec les mots BONNE / ANNEE

[Invité]

Hello laroute,
je reviens de ton forum et tu as déposé beaucoup de trop de d'images champagne etc.
On peut tout placer sauf la bouteille de Champagne( de toutes façons elle doivent être bues désormais    ).

De plus , il faudrait donner les codes modifiés au fur et à mesure, cela m'éviterait d'aller aux informations sur ton forum cher ami.


Donc si on remplace le script suivant:

Code:

$(function(){$('div[id="logo-desc"]').each(function(){$(this).find('b').before('<img src="https://i.servimg.com/u/f85/14/19/26/38/santa_14.png"/>');$(this).find('b').after('<img src="https://i.servimg.com/u/f85/14/19/26/38/snowma11.png"/>')})});

Par celui-ci:

Code:

$(function(){$('div[id="logo-desc"]').each(function(){
  $(this).find('b').before('
                          <span style="float:left;">
<img src="https://i.servimg.com/u/f85/14/19/26/38/63105814.gif">
<img src="https://i.servimg.com/u/f85/14/19/26/38/67439614.gif">
<img src="https://i.servimg.com/u/f85/14/19/26/38/64087123.gif">
<img src="https://i.servimg.com/u/f85/14/19/26/38/64087124.gif">
<img src="https://i.servimg.com/u/f85/14/19/26/38/24287115.gif">
                          </span>
<img src="https://i.servimg.com/u/f85/14/19/26/38/santa_14.png"/>');
 $(this).find('b').after('
<img src="https://i.servimg.com/u/f85/14/19/26/38/snowma11.png"/>
                        <span style="float:right;">
<img src="https://i.servimg.com/u/f85/14/19/26/38/47387613.gif">
<img src="https://i.servimg.com/u/f85/14/19/26/38/64087125.gif">
<img src="https://i.servimg.com/u/f85/14/19/26/38/64087126.gif">
<img src="https://i.servimg.com/u/f85/14/19/26/38/24287116.gif">
<img src="https://i.servimg.com/u/f85/14/19/26/38/24287117.gif"></span>')})});

Tu devrais avoir le résultat escompté cher ami .


a++