Soucis sélecteur de thème et couleur de fond de la boite à smileys.

par demeter1 Dim 8 Déc 2013 - 17:22

Rappel du premier message :

Bonjour à tous, je suis en train de faire un thème pour un sélecteur . J'ai réussi à modifier tout ce que je souhaitai sauf la couleur de la boite à smiley.

Alors, j'ai tenté

Code:: #sceditor_smilies body {background-color: #dddddd !important; }

et

Code:: #sceditor_smilies body { background-image: url("http://i55.servimg.com/u/f55/11/93/85/24/fond10.png")!important;}

et

Code:: #sceditor_smilies {background-color: #dddddd !important; }

et

Code:: #sceditor_smilies { background-image: url("http://i55.servimg.com/u/f55/11/93/85/24/fond10.png")!important;}

Ainsi qu'un mix image et couleur.

Là, choux blanc.

Bon, après cet échec, j'ai modifié le template posting_smilies_frame en attribuant une class

Code:: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html> <head> <title>{L_SMILIES_TITLE}</title> <link rel="stylesheet" href="{T_HEAD_STYLESHEET}" type="text/css" /> <script src="{JQUERY_PATH}" type="text/javascript"></script> <script src="{JS_DIR}{L_LANG}.js" type="text/javascript"></script> <meta http-equiv="content-type" content="text/html; charset={S_CONTENT_ENCODING}" /> <meta http-equiv="content-script-type" content="text/javascript" /> <meta http-equiv="content-style-type" content="text/css" /> <style type="text/css"> body{background-color:{T_BODY_BGCOLOR};margin: 0;} </style> </head> <body text="{T_BODY_TEXT}"> <table width="100%" border="0" cellspacing="0" cellpadding="0" summary="smiliesframe"> <tr><td> <table class="fond_smileys" width="100%" border="0" cellspacing="1" cellpadding="4" summary="smiliesform"> <tr> <th class="thHead" height="25"> <form id="smilies_categ" action="" method="get" name="smilies_categ"> <select name="categ" size="1" onchange="forms['smilies_categ'].submit()"> <option value="">{L_VIEW_MORE}</option>{SELECT_OPTIONS} </select> <input type="hidden" name="mode" value="smilies_frame" /> <input type="submit" name="Ok" value="Ok" /> </form> </th> </tr> <tr><td> <table width="100%" border="0" cellspacing="0" cellpadding="5" summary="smilies"> <tr align="center" valign="middle"><td class="fond_smileys">   <a href="javascript:emoticonp('{smilies_row.smilies_col.SMILEY_CODE}')"><img title="{smilies_row.smilies_col.SMILEY_DESC}" src="{smilies_row.smilies_col.SMILEY_IMG}" alt="{smilies_row.smilies_col.SMILEY_DESC}" /></a>   </td></tr> </table> </td></tr> </table> </td></tr> </table> </body> </html>

avec pour css

Code:: .fond_smileys{ background-color #dddddd !important; }

Échec encore une fois.

J'ai changé le css par

Code:: .fond_smileys{background-image: url("http://i55.servimg.com/u/f55/11/93/85/24/fond10.png")!important;}

Rebelote, encore un échec affraid

J'ai bien entendu vidé mes caches à chaque manip

En supplément le script du sélecteur au cas ou :

Code:: $("head").append('<link rel="stylesheet" type="text/css" id="tstyle" />');if(my_getcookie("sstyle")){$("#tstyle").attr("href",my_getcookie('sstyle'))}function addstyle(nom,lien){$("#sstyle").append('<option value="'+lien+'">'+nom+'</option>')}$(function(){$("#frame_chatbox").load(function(){$("#frame_chatbox").contents().find("head").append($("#tstyle").clone())});$("iframe[name=smilies]").load(function(){$("iframe[name=smilies]").contents().find("head").append($("#tstyle").clone()).append('<style type="text/css">body{margin:0!important;}</style>')});$("#selecteur").append('<select id="sstyle" onChange="my_setcookie(\'sstyle\',$(\'#tstyle\')[0].href=this.value,1,0);$(\'#frame_chatbox,iframe[name=smilies]\').contents().find(\'#tstyle\').attr(\'href\',this.value);this.selectedIndex=0;"><option>Choisir un style</option></select>');addstyle("Thème complet vert","http://sd-5.archive-host.com/membres/up/22406661265772126/fichier_css_pour_selecteur_2_fond_de_page/fond1.css");addstyle(" Thème partiel sable","http://sd-5.archive-host.com/membres/up/22406661265772126/fichiers_css_pour_selecteur_de_themes/selecteur_sable.css");addstyle("Thème partiel Crème","http://sd-5.archive-host.com/membres/up/22406661265772126/fichiers_css_pour_selecteur_de_themes/css_selecteur_creme.css");addstyle("Thème partiel Cactus Arizona ","http://sd-5.archive-host.com/membres/up/22406661265772126/fichiers_css_pour_selecteur_de_themes/cactus_arizona_2.css");addstyle("Thème partiel Tropical ","http://sd-5.archive-host.com/membres/up/22406661265772126/fichiers_css_pour_selecteur_de_themes/css_adam_et_eve_3.css");addstyle("Thème partiel Afrique ","http://sd-5.archive-host.com/membres/up/22406661265772126/fichiers_css_pour_selecteur_de_themes/css_afrique.css");addstyle("Thème partiel Fantaisie ","http://sd-5.archive-host.com/membres/up/22406661265772126/fichiers_css_pour_selecteur_de_themes/champi.css");addstyle("Thème partiel City air ","http://sd-5.archive-host.com/membres/up/22406661265772126/fichiers_css_pour_selecteur_de_themes/ballon.css");addstyle("Thème partiel Faune ","http://sd-5.archive-host.com/membres/up/22406661265772126/fichiers_css_pour_selecteur_de_themes/theme_faune_perrroquet.css");addstyle("Thème partiel Rétro ","http://sd-5.archive-host.com/membres/up/22406661265772126/fichiers_css_pour_selecteur_de_themes/retro_2.css");addstyle("Thème partiel Fruits ","http://sd-5.archive-host.com/membres/up/22406661265772126/fichiers_css_pour_selecteur_de_themes/fruits.css");addstyle("Thème partiel Perroquet et plantes ","http://sd-5.archive-host.com/membres/up/22406661265772126/fichiers_css_pour_selecteur_de_themes/oiseau_et_plante.css");addstyle("Thème partiel Cactus","http://sd-5.archive-host.com/membres/up/22406661265772126/fichiers_css_pour_selecteur_de_themes/cactus_pour_diane.css");addstyle("Thème partiel Raflesia","http://sd-5.archive-host.com/membres/up/22406661265772126/fichiers_css_pour_selecteur_de_themes/raflesia.css");addstyle("Thème partiel Tulipe","http://sd-5.archive-host.com/membres/up/22406661265772126/fichiers_css_pour_selecteur_de_themes/tulipe.css");addstyle("Thème partiel Fish","http://sd-5.archive-host.com/membres/up/22406661265772126/fichiers_css_pour_selecteur_de_themes/fish.css");addstyle("Style par défaut","")});

Si quelqu'un à une idée pour modifier la couleur de fond de la boite à smiley car là, pour une manip css simple je suis en train de me prendre la tête comme ce n'est pas possible.

Merci par avance pour votre aide.

par **Chapo** Ven 21 Fév 2014 - 11:29

@demeter1: J'ai testé en phpBB2 le code suivant qui fonctionne (ajouté dans PA -> Affichage -> Images et couleurs -> Couleurs -> Feuille de style CSS):

Code:: body#sce_smilies_body td.row1 { background:#dddddd url("http://i55.servimg.com/u/f55/11/93/85/24/fond10.png") repeat !important; }

Le résultat:

Soucis sélecteur de thème et couleur de fond de la boite à smileys. - Page 3 Screen10

par demeter1 Lun 24 Fév 2014 - 17:48

Bonjour Chapo,
Désolé pour ce retard. je viens de tester à l'instant et le soucis est à l'identique. le css hébergé sur une feuille de style externe n'est pas pris en compte par le sélecteur.
Voici les dernières infos transmises afin de pouvoir constater le soucis.

Un grand merci pour cette aide.

demeter1 a écrit:Bonjour Tech ,
Pas de soucis; le topic est assez long.
Afin de faciliter les choses, j'ai créé un thème intitulé " essai pour fa".

La feuille de style regroupe tous les css visant à modifier la couleur de la boite à smiley
Voir le Fichier : le lien du fichier

Son contenu
Code:
#sceditor_smilies .row1 { background:url("http://i55.servimg.com/u/f55/11/93/85/24/fond10.png")!important; } #sceditor_smilies .row1 {background:#dddddd !important;} #sceditor_smilies .row1{background-image:url("http://i55.servimg.com/u/f55/11/93/85/24/fond10.png")!important;background-repeat: repeat; background-position:center;} #sceditor_smilies .row1 { background:url("http://i55.servimg.com/u/f55/11/93/85/24/fond10.png")!important; } #sceditor_smilies .row1 {background:#dddddd !important;} forumline .row1 {background:#dddddd !important;} #sceditor_smilies ,#sceditor_smilies .row1 , #smilies_header , #sce_smilies_body , .sceditor-dropdown.sceditor-emoticon {background:#dddddd !important;} #smilies_header form select { background:#dddddd !important; } #smiley-box {background:#dddddd !important; } #sceditor_smilies #sce_smilies_body { background-color: #dddddd !important; } #sceditor_smilies { background: linear-gradient(#dddddd , #dddddd ) repeat scroll 0 0 rgba(0, 0, 0, 0) !important; border: 1px dotted #281D5C; } html#sceditor_smilies body { background-image: linear-gradient(#dddddd , #dddddd); border: 3px double #21559F !important; border-radius: 0 !important; box-shadow: 0 1px 10px rgba(97, 191, 249, 0.584); margin: 10px; min-height: 800px; }

Le message rapide a été modifié pour reprendre l'iframe du message étendu. J'aimerai pouvoir modifier la couleur de fond sur ces deux parties.

ou tout simplement en passant par une section ouverte aux invités
http://altitudetropicale.forums-actifs.com/f62-les-forums-ou-sites-de-jardinage-a-l-honneur

Comme vous le verrez, le fond de la boite à smiley qui est de couleur noire sur le thème d'origine ne prend pas la couleur #dddddd d dés que l'on passe sur le thème intitulé "essai pour FA".

En analysant le thème avec les outils du navigateur, on voit qu'aucun css n'est pris en charge pour la boite à smiley hormis le css d'origine contenu dans le pa.

et la modification du js fournie par Ea qui malheureusement n'a pas fonctionné. Un grand merci a Ea pour cette aide.

Ea a écrit:Bonjour,

Code:
   $("iframe[name=smilies]").load(function () {    $("iframe[name=smilies]").contents().find("head").append($("#tstyle").clone()).append('<style type="text/css">body{margin:0!important;}</style>')    });

c'est censé arriver quand l'iframe se charge mais si ça ne fonctionne pas c'est qu'il y a un couac ( soit au niveau navigateur, soit au niveau jquery ) que je n'ai pas vu. à la création du script ça fonctionnait mais les choses évoluent.

peut-être remplacer par un code du style :

Code:
$("iframe[name=smilies]").contents().find("head").append($("#tstyle").clone()).append('<style type="text/css">body{margin:0!important;}</style>');

en se disant que c'est déjà chargé avec de la chance, sinon un code du style :

Code:
setTimeout(function(){   $("iframe[name=smilies]").contents().find("head").append($("#tstyle").clone()).append('<style type="text/css">body{margin:0!important;}</style>'); }, 500);

pour que ça soit par exemple exécuté 500 millisecondes après l'ouverture de la page ( cela devrait être suffisant, on pourrait tester pour moins ).

Sinon j'imagine que la remarque est pareille pour la partie qui s'occupe de la chatbox ( ça n'a d'influence que si la chatbox est inclue dans des pages du forum ).

Tout ça c'est pour les smileys en mode réponse complète, pour la réponse rapide le frame ne se charge qu'au clic sur le bouton donc c'est plus complexe, peut-être un code comme ceci dans le $(function(){ ... }) :

Code:
$('a.sceditor-button.sceditor-button-emoticon').click(function(){   $('iframe#quickEmojInternal').contents().find("head").append($("#tstyle").clone()).append('<style type="text/css">body{margin:0!important;}</style>'); });

et puis modifier le :

Code:
#frame_chatbox,iframe[name=smilies]

en :

Code:
#frame_chatbox,iframe[name=smilies],#quickEmojInternal

demeter1 a écrit:Bonjour Ea,
Un grand merci pour cette aide. J'ai un peu honte de vous dire que Malheureusement, la couleur de la boite à smiley reste désespérément noir.

J'ai testé :
Solution1
Code:
$("head").append('<link rel="stylesheet" type="text/css" id="tstyle" />');if(my_getcookie("sstyle")){$("#tstyle").attr("href",my_getcookie('sstyle'))}function addstyle(nom,lien){$("#sstyle").append('<option value="'+lien+'">'+nom+'</option>')}$(function(){$("#frame_chatbox").load(function(){$("#frame_chatbox").contents().find("head").append($("#tstyle").clone())}); setTimeout(function(){   $("iframe[name=smilies]").contents().find("head").append($("#tstyle").clone()).append('<style type="text/css">body{margin:0!important;}</style>'); }, 500); $("#selecteur").append('<select id="sstyle" onChange="my_setcookie(\'sstyle\',$(\'#tstyle\')[0].href=this.value,1,0);$(\'#frame_chatbox,iframe[name=smilies]\').contents().find(\'#tstyle\').attr(\'href\',this.value);this.selectedIndex=0;"><option>Choisir un style</option> </select>');addstyle("Thème complet vert","http://sd-5.archive-host.com/membres/up/22406661265772126/Theme_vert/fond1.css") ;;addstyle(" Thème complet chocolat","http://sd-5.archive-host.com/membres/up/22406661265772126/Theme_chocolat/theme_chocolat.css") ;addstyle(" Thème complet lotus","http://sd-5.archive-host.com/membres/up/22406661265772126/Theme_lotus/theme_lotus.css");addstyle(" Thème complet orchid","http://sd-5.archive-host.com/membres/up/22406661265772126/Theme_orchid/orchid.css");addstyle(" Thème complet steampunk palm","http://sd-5.archive-host.com/membres/up/22406661265772126/steampunk/steampunk.css");addstyle(" Thème complet parchemin","http://sd-5.archive-host.com/membres/up/22406661265772126/Theme_parchemin/parchemin.css");addstyle(" Thème complet jungle monkey","http://sd-5.archive-host.com/membres/up/22406661265772126/jungle_monkey_et_toucan/jungle_toucan.css");addstyle(" Thème en construction","http://sd-5.archive-host.com/membres/up/22406661265772126/voyage/voyage.css"); addstyle(" essai pour FA","http://sd-5.archive-host.com/membres/up/22406661265772126/pour_Fa.css");addstyle("Thème partiel Crème","http://sd-5.archive-host.com/membres/up/22406661265772126/fichiers_css_pour_selecteur_de_themes/css_selecteur_creme.css");addstyle("Thème partiel Cactus Arizona ","http://sd-5.archive-host.com/membres/up/22406661265772126/fichiers_css_pour_selecteur_de_themes/cactus_arizona_2.css");addstyle("Thème partiel Tropical ","http://sd-5.archive-host.com/membres/up/22406661265772126/fichiers_css_pour_selecteur_de_themes/css_adam_et_eve_3.css");addstyle("Thème partiel Afrique ","http://sd-5.archive-host.com/membres/up/22406661265772126/fichiers_css_pour_selecteur_de_themes/css_afrique.css");addstyle("Thème partiel Fantaisie ","http://sd-5.archive-host.com/membres/up/22406661265772126/fichiers_css_pour_selecteur_de_themes/champi.css");addstyle("Thème partiel City air ","http://sd-5.archive-host.com/membres/up/22406661265772126/fichiers_css_pour_selecteur_de_themes/ballon.css");addstyle("Thème partiel Faune ","http://sd-5.archive-host.com/membres/up/22406661265772126/fichiers_css_pour_selecteur_de_themes/theme_faune_perrroquet.css");addstyle("Thème partiel Rétro ","http://sd-5.archive-host.com/membres/up/22406661265772126/fichiers_css_pour_selecteur_de_themes/retro_2.css");addstyle("Thème partiel Fruits ","http://sd-5.archive-host.com/membres/up/22406661265772126/fichiers_css_pour_selecteur_de_themes/fruits.css");addstyle("Thème partiel Perroquet et plantes ","http://sd-5.archive-host.com/membres/up/22406661265772126/fichiers_css_pour_selecteur_de_themes/oiseau_et_plante.css");addstyle("Thème partiel Cactus","http://sd-5.archive-host.com/membres/up/22406661265772126/fichiers_css_pour_selecteur_de_themes/cactus_pour_diane.css");addstyle("Thème partiel Raflesia","http://sd-5.archive-host.com/membres/up/22406661265772126/fichiers_css_pour_selecteur_de_themes/raflesia.css");addstyle("Thème partiel Tulipe","http://sd-5.archive-host.com/membres/up/22406661265772126/fichiers_css_pour_selecteur_de_themes/tulipe.css");addstyle("Thème partiel Fish","http://sd-5.archive-host.com/membres/up/22406661265772126/fichiers_css_pour_selecteur_de_themes/fish.css");addstyle("Style par défaut","")});

Solution 2
Code:
$("head").append('<link rel="stylesheet" type="text/css" id="tstyle" />');if(my_getcookie("sstyle")){$("#tstyle").attr("href",my_getcookie('sstyle'))}function addstyle(nom,lien){$("#sstyle").append('<option value="'+lien+'">'+nom+'</option>')}$(function(){$("#frame_chatbox").load(function(){$("#frame_chatbox").contents().find("head").append($("#tstyle").clone())}); $("iframe[name=smilies]").contents().find("head").append($("#tstyle").clone()).append('<style type="text/css">body{margin:0!important;}</style>'); $("#selecteur").append('<select id="sstyle" onChange="my_setcookie(\'sstyle\',$(\'#tstyle\')[0].href=this.value,1,0);$(\'#frame_chatbox,iframe[name=smilies]\').contents().find(\'#tstyle\').attr(\'href\',this.value);this.selectedIndex=0;"><option>Choisir un style</option> </select>');addstyle("Thème complet vert","http://sd-5.archive-host.com/membres/up/22406661265772126/Theme_vert/fond1.css") ;;addstyle(" Thème complet chocolat","http://sd-5.archive-host.com/membres/up/22406661265772126/Theme_chocolat/theme_chocolat.css") ;addstyle(" Thème complet lotus","http://sd-5.archive-host.com/membres/up/22406661265772126/Theme_lotus/theme_lotus.css");addstyle(" Thème complet orchid","http://sd-5.archive-host.com/membres/up/22406661265772126/Theme_orchid/orchid.css");addstyle(" Thème complet steampunk palm","http://sd-5.archive-host.com/membres/up/22406661265772126/steampunk/steampunk.css");addstyle(" Thème complet parchemin","http://sd-5.archive-host.com/membres/up/22406661265772126/Theme_parchemin/parchemin.css");addstyle(" Thème complet jungle monkey","http://sd-5.archive-host.com/membres/up/22406661265772126/jungle_monkey_et_toucan/jungle_toucan.css");addstyle(" Thème en construction","http://sd-5.archive-host.com/membres/up/22406661265772126/voyage/voyage.css");addstyle(" essai pour FA","http://sd-5.archive-host.com/membres/up/22406661265772126/pour_Fa.css");addstyle("Thème partiel Crème","http://sd-5.archive-host.com/membres/up/22406661265772126/fichiers_css_pour_selecteur_de_themes/css_selecteur_creme.css");addstyle("Thème partiel Cactus Arizona ","http://sd-5.archive-host.com/membres/up/22406661265772126/fichiers_css_pour_selecteur_de_themes/cactus_arizona_2.css");addstyle("Thème partiel Tropical ","http://sd-5.archive-host.com/membres/up/22406661265772126/fichiers_css_pour_selecteur_de_themes/css_adam_et_eve_3.css");addstyle("Thème partiel Afrique ","http://sd-5.archive-host.com/membres/up/22406661265772126/fichiers_css_pour_selecteur_de_themes/css_afrique.css");addstyle("Thème partiel Fantaisie ","http://sd-5.archive-host.com/membres/up/22406661265772126/fichiers_css_pour_selecteur_de_themes/champi.css");addstyle("Thème partiel City air ","http://sd-5.archive-host.com/membres/up/22406661265772126/fichiers_css_pour_selecteur_de_themes/ballon.css");addstyle("Thème partiel Faune ","http://sd-5.archive-host.com/membres/up/22406661265772126/fichiers_css_pour_selecteur_de_themes/theme_faune_perrroquet.css");addstyle("Thème partiel Rétro ","http://sd-5.archive-host.com/membres/up/22406661265772126/fichiers_css_pour_selecteur_de_themes/retro_2.css");addstyle("Thème partiel Fruits ","http://sd-5.archive-host.com/membres/up/22406661265772126/fichiers_css_pour_selecteur_de_themes/fruits.css");addstyle("Thème partiel Perroquet et plantes ","http://sd-5.archive-host.com/membres/up/22406661265772126/fichiers_css_pour_selecteur_de_themes/oiseau_et_plante.css");addstyle("Thème partiel Cactus","http://sd-5.archive-host.com/membres/up/22406661265772126/fichiers_css_pour_selecteur_de_themes/cactus_pour_diane.css");addstyle("Thème partiel Raflesia","http://sd-5.archive-host.com/membres/up/22406661265772126/fichiers_css_pour_selecteur_de_themes/raflesia.css");addstyle("Thème partiel Tulipe","http://sd-5.archive-host.com/membres/up/22406661265772126/fichiers_css_pour_selecteur_de_themes/tulipe.css");addstyle("Thème partiel Fish","http://sd-5.archive-host.com/membres/up/22406661265772126/fichiers_css_pour_selecteur_de_themes/fish.css");addstyle("Style par défaut","")});

J'ai tenté avec l'inclusion de la chatbox mais là, le sélecteur disparait. La chabox n'est par contre pas activé sur le forum ce qui pourrait expliquer ce défaut d'apparition du sélecteur.
Solution 3

Code:
$("head").append('<link rel="stylesheet" type="text/css" id="tstyle" />');if(my_getcookie("sstyle")){$("#tstyle").attr("href",my_getcookie('sstyle'))}function addstyle(nom,lien){$("#sstyle").append('<option value="'+lien+'">'+nom+'</option>')}$(function(){$("#frame_chatbox").load(function(){$("#frame_chatbox").contents().find("head").append($("#tstyle").clone())}); $('a.sceditor-button.sceditor-button-emoticon').click(function(){   $('iframe#quickEmojInternal').contents().find("head").append($("#tstyle").clone()).append('<style type="text/css">body{margin:0!important;}</style>'); }); $("#selecteur").append('<select id="sstyle" onChange="my_setcookie(\'sstyle\',$(\'#tstyle\')[0].href=this.value,1,0);$(\'#frame_chatbox,iframe[name=smilies],#quickEmojInternal\') .contents().find(\'#tstyle\').attr(\'href\',this.value);this.selectedIndex=0;"><option>Choisir un style</option> </select>');addstyle("Thème complet vert","http://sd-5.archive-host.com/membres/up/22406661265772126/Theme_vert/fond1.css") ;;addstyle(" Thème complet chocolat","http://sd-5.archive-host.com/membres/up/22406661265772126/Theme_chocolat/theme_chocolat.css") ;addstyle(" Thème complet lotus","http://sd-5.archive-host.com/membres/up/22406661265772126/Theme_lotus/theme_lotus.css");addstyle(" Thème complet orchid","http://sd-5.archive-host.com/membres/up/22406661265772126/Theme_orchid/orchid.css");addstyle(" Thème complet steampunk palm","http://sd-5.archive-host.com/membres/up/22406661265772126/steampunk/steampunk.css");addstyle(" Thème complet parchemin","http://sd-5.archive-host.com/membres/up/22406661265772126/Theme_parchemin/parchemin.css");addstyle(" Thème complet jungle monkey","http://sd-5.archive-host.com/membres/up/22406661265772126/jungle_monkey_et_toucan/jungle_toucan.css"); addstyle(" Thème en construction","http://sd-5.archive-host.com/membres/up/22406661265772126/voyage/voyage.css"); addstyle(" essai pour FA","http://sd-5.archive-host.com/membres/up/22406661265772126/pour_Fa.css"); addstyle("Thème partiel Crème","http://sd-5.archive-host.com/membres/up/22406661265772126/fichiers_css_pour_selecteur_de_themes/css_selecteur_creme.css");addstyle("Thème partiel Cactus Arizona ","http://sd-5.archive-host.com/membres/up/22406661265772126/fichiers_css_pour_selecteur_de_themes/cactus_arizona_2.css");addstyle("Thème partiel Tropical ","http://sd-5.archive-host.com/membres/up/22406661265772126/fichiers_css_pour_selecteur_de_themes/css_adam_et_eve_3.css");addstyle("Thème partiel Afrique ","http://sd-5.archive-host.com/membres/up/22406661265772126/fichiers_css_pour_selecteur_de_themes/css_afrique.css");addstyle("Thème partiel Fantaisie ","http://sd-5.archive-host.com/membres/up/22406661265772126/fichiers_css_pour_selecteur_de_themes/champi.css");addstyle("Thème partiel City air ","http://sd-5.archive-host.com/membres/up/22406661265772126/fichiers_css_pour_selecteur_de_themes/ballon.css");addstyle("Thème partiel Faune ","http://sd-5.archive-host.com/membres/up/22406661265772126/fichiers_css_pour_selecteur_de_themes/theme_faune_perrroquet.css");addstyle("Thème partiel Rétro ","http://sd-5.archive-host.com/membres/up/22406661265772126/fichiers_css_pour_selecteur_de_themes/retro_2.css");addstyle("Thème partiel Fruits ","http://sd-5.archive-host.com/membres/up/22406661265772126/fichiers_css_pour_selecteur_de_themes/fruits.css");addstyle("Thème partiel Perroquet et plantes ","http://sd-5.archive-host.com/membres/up/22406661265772126/fichiers_css_pour_selecteur_de_themes/oiseau_et_plante.css");addstyle("Thème partiel Cactus","http://sd-5.archive-host.com/membres/up/22406661265772126/fichiers_css_pour_selecteur_de_themes/cactus_pour_diane.css");addstyle("Thème partiel Raflesia","http://sd-5.archive-host.com/membres/up/22406661265772126/fichiers_css_pour_selecteur_de_themes/raflesia.css");addstyle("Thème partiel Tulipe","http://sd-5.archive-host.com/membres/up/22406661265772126/fichiers_css_pour_selecteur_de_themes/tulipe.css");addstyle("Thème partiel Fish","http://sd-5.archive-host.com/membres/up/22406661265772126/fichiers_css_pour_selecteur_de_themes/fish.css");addstyle("Style par défaut","")});

J'ai laissé en place le premier code pour que vous puissiez avoir un visu sur un topic ouvert aux invités
http://altitudetropicale.forums-actifs.com/f62-les-forums-ou-sites-de-jardinage-a-l-honneur

par medamine14 Lun 24 Fév 2014 - 19:53

Bonjour,

voila essaye ceci :

Code:: $(function(){ setTimeout(function(){ $("iframe[name='smilies']").contents().find("body").append('<link rel="stylesheet" href="http://sd-5.archive-host.com/membres/up/22406661265772126/pour_Fa.css" type="text/css">'); },2000); $(window).load(function(){ ('a.sceditor-button.sceditor-button-emoticon').click(setTimeout(function(){ $('#quickEmojInternal').contents().find("body").append('<link rel="stylesheet" href="http://sd-5.archive-host.com/membres/up/22406661265772126/pour_Fa.css" type="text/css">'); },8000)); }); });

il marchera a 90% Smile

par demeter1 Mar 25 Fév 2014 - 14:10

Bonjour Medamine,
Merci pour cette aide. j'ai testé le code seul ou modifié ainsi :

Code:: $("head").append('<link rel="stylesheet" type="text/css" id="tstyle" />');if(my_getcookie("sstyle")){$("#tstyle").attr("href",my_getcookie('sstyle'))}function addstyle(nom,lien){$("#sstyle").append('<option value="'+lien+'">'+nom+'</option>')}$(function(){$("#frame_chatbox").load(function(){$("#frame_chatbox").contents().find("head").append($("#tstyle").clone())}); $(function(){ setTimeout(function(){ $("iframe[name='smilies']").contents().find("body").append('<link rel="stylesheet" href="http://sd-5.archive-host.com/membres/up/22406661265772126/pour_Fa.css" type="text/css">'); },2000); $(window).load(function(){ ('a.sceditor-button.sceditor-button-emoticon').click(setTimeout(function(){ $('#quickEmojInternal').contents().find("body").append('<link rel="stylesheet" href="http://sd-5.archive-host.com/membres/up/22406661265772126/pour_Fa.css" type="text/css">'); },8000)); }); });

Le soucis, c'est que le sélecteur disparait . Très certainement une mauvaise manip de mon côté dans l'utilisation du code. Embarassed

par **Chapo** Mer 26 Fév 2014 - 10:07

@demeter1: concernant les propositions de résolution en JS ce ne sont (pour moi) des solutions qui ne peuvent être pertinentes que dans certains cas et tant que l'on a pas trouvé l'origine du problème, proposer directement une solution JS à un problème CSS ne me semble pas être la bonne voie à explorer.

Concernant le fait que mon code CSS ne fonctionne pas, je n'arrive pas à voir pourquoi sachant que pour les forums sur lesquels j'ai testé ça fonctionnait. Est-ce que vous auriez un forum sur lequel je peux essayer directement de faire passer la modif et de là essayer de comprendre ce qui ne va pas soit pour solutionner le problème soit pour en faire un retourplus détaillé à la communauté ?

par medamine14 Mer 26 Fév 2014 - 13:45

Re/salut,

tu avais mal fermé ton code ^^
voila le rendu :

Code:: $(function(){$("head").append('<link rel="stylesheet" type="text/css" id="tstyle" />'); if(my_getcookie("sstyle")){ $("#tstyle").attr("href",my_getcookie('sstyle'))} function addstyle(nom,lien){ $("#sstyle").append('<option value="'+lien+'">'+nom+'</option>')} $(function(){$("#frame_chatbox").load(function(){ $("#frame_chatbox").contents().find("body").append($("#tstyle").clone())}); $(function(){ setTimeout(function(){ $("iframe[name='smilies']").contents().find("body").append('<link rel="stylesheet" id="tstyle" href="http://sd-5.archive-host.com/membres/up/22406661265772126/pour_Fa.css" type="text/css">'); },2000); $(window).load(function(){ ('a.sceditor-button.sceditor-button-emoticon').click(setTimeout(function(){ $('#quickEmojInternal').contents().find("body").append('<link rel="stylesheet" id="tstyle" href="http://sd-5.archive-host.com/membres/up/22406661265772126/pour_Fa.css" type="text/css">'); },8000)); }); }); });});

par contre je vois pas le selecteur dans le code ... ^^

par demeter1 Mer 26 Fév 2014 - 18:27

Bonjour Chapo,
Je viens de reporter le js ainsi que les templates et le css sur ce forum
http://crevettes-passion.forumgratuit.org

La feuille de style hébergée sur archive host intitulée "essai pour FA" qui ne contient que des css visant à modifier la couleur de fond de la boite à smiley

Voir le Fichier : le lien du fichier

son contenu

Code:: body#sce_smilies_body td.row1 { background:#dddddd url("http://i55.servimg.com/u/f55/11/93/85/24/fond10.png") repeat !important; } #sceditor_smilies body { background-color: #dddddd !important; margin: 5px; } #sceditor_smilies .row1 { background:url("http://i55.servimg.com/u/f55/11/93/85/24/fond10.png")!important; } #sceditor_smilies .row1 {background:#dddddd !important;} #sceditor_smilies .row1{background-image:url("http://i55.servimg.com/u/f55/11/93/85/24/fond10.png")!important;background-repeat: repeat; background-position:center;} #sceditor_smilies .row1 { background:url("http://i55.servimg.com/u/f55/11/93/85/24/fond10.png")!important; } #sceditor_smilies .row1 {background:#dddddd !important;} forumline .row1 {background:#dddddd !important;} #sceditor_smilies ,#sceditor_smilies .row1 , #smilies_header , #sce_smilies_body , .sceditor-dropdown.sceditor-emoticon {background:#dddddd !important;} #smilies_header form select { background:#dddddd !important; } #smiley-box {background:#dddddd !important; } #sceditor_smilies #sce_smilies_body { background-color: #dddddd !important; } #sceditor_smilies { background: linear-gradient(#dddddd , #dddddd ) repeat scroll 0 0 rgba(0, 0, 0, 0) !important; border: 1px dotted #281D5C; } html#sceditor_smilies body { background-image: linear-gradient(#dddddd , #dddddd); border: 3px double #21559F !important; border-radius: 0 !important; box-shadow: 0 1px 10px rgba(97, 191, 249, 0.584); margin: 10px; min-height: 800px; }

Le js du sélecteur qui est installé pour l'instant

Code:: $("head").append('<link rel="stylesheet" type="text/css" id="tstyle" />');if(my_getcookie("sstyle")){$("#tstyle").attr("href",my_getcookie('sstyle'))}function addstyle(nom,lien){$("#sstyle").append('<option value="'+lien+'">'+nom+'</option>')}$(function(){$("#frame_chatbox").load(function(){$("#frame_chatbox").contents().find("head").append($("#tstyle").clone())}); setTimeout(function(){ $("iframe[name=smilies]").contents().find("head").append($("#tstyle").clone()).append('<style type="text/css">body{margin:0!important;}</style>'); }, 500); $("#selecteur").append('<select id="sstyle" onChange="my_setcookie(\'sstyle\',$(\'#tstyle\')[0].href=this.value,1,0);$(\'#frame_chatbox,iframe[name=smilies]\').contents().find(\'#tstyle\').attr(\'href\',this.value);this.selectedIndex=0;"><option>Choisir un style</option> </select>');addstyle("Thème complet vert","http://sd-5.archive-host.com/membres/up/22406661265772126/Theme_vert/fond1.css") ;;addstyle(" Thème complet chocolat","http://sd-5.archive-host.com/membres/up/22406661265772126/Theme_chocolat/theme_chocolat.css") ;addstyle(" Thème complet lotus","http://sd-5.archive-host.com/membres/up/22406661265772126/Theme_lotus/theme_lotus.css");addstyle(" Thème complet orchid","http://sd-5.archive-host.com/membres/up/22406661265772126/Theme_orchid/orchid.css");addstyle(" Thème complet steampunk palm","http://sd-5.archive-host.com/membres/up/22406661265772126/steampunk/steampunk.css");addstyle(" Thème complet parchemin","http://sd-5.archive-host.com/membres/up/22406661265772126/Theme_parchemin/parchemin.css");addstyle(" Thème complet jungle monkey","http://sd-5.archive-host.com/membres/up/22406661265772126/jungle_monkey_et_toucan/jungle_toucan.css");addstyle(" Thème complet lierre","http://sd-5.archive-host.com/membres/up/22406661265772126/Theme_lierre/theme_lierre.css"); addstyle(" Thème complet Stapelia cuir","http://sd-5.archive-host.com/membres/up/22406661265772126/cuir_stapelia/cuir_stapelia.css");addstyle(" thème complet floraria Hydra","http://sd-5.archive-host.com/membres/up/22406661265772126/La_fleuriste/theme_hydra2.css"); addstyle(" essai pour FA","http://sd-5.archive-host.com/membres/up/22406661265772126/pour_Fa.css"); addstyle("Style par défaut","")});

Bonjour Medamine14,

Le sélecteur est géré via une div contenue dans le template overall header. Voici la séquence

Code::  <table cellspacing="0" cellpadding="0" border="0" align="center"> <tr> <td><div id="selecteur"></div></td></tr></table>

J'ai tenté maladroitement :

Code:: $(function(){$("head").append('<link rel="stylesheet" type="text/css" id="tstyle" />'); if(my_getcookie("sstyle")){ $("#tstyle").attr("href",my_getcookie('sstyle'))} function addstyle(nom,lien){ $("#selecteur").append('<option value="'+lien+'">'+nom+'</option>')} $(function(){$("#frame_chatbox").load(function(){ $("#frame_chatbox").contents().find("body").append($("#tstyle").clone())}); $(function(){ setTimeout(function(){ $("iframe[name='smilies']").contents().find("body").append('<link rel="stylesheet" id="tstyle" href="http://sd-5.archive-host.com/membres/up/22406661265772126/pour_Fa.css" type="text/css">'); },2000); $(window).load(function(){ ('a.sceditor-button.sceditor-button-emoticon').click(setTimeout(function(){ $('#quickEmojInternal').contents().find("body").append('<link rel="stylesheet" id="tstyle" href="http://sd-5.archive-host.com/membres/up/22406661265772126/pour_Fa.css" type="text/css">'); },8000)); }); }); });});

et

Code:: $(function(){$("head").append('<link rel="stylesheet" type="text/css" id="tstyle" />'); if(my_getcookie("sstyle")){ $("#tstyle").attr("href",my_getcookie('sstyle'))} function addstyle(nom,lien){ $("#selecteur").append('<select id="sstyle"option value="'+lien+'">'+nom+'</option>')} $(function(){$("#frame_chatbox").load(function(){ $("#frame_chatbox").contents().find("body").append($("#tstyle").clone())}); $(function(){ setTimeout(function(){ $("iframe[name='smilies']").contents().find("body").append('<link rel="stylesheet" id="tstyle" href="http://sd-5.archive-host.com/membres/up/22406661265772126/pour_Fa.css" type="text/css">'); },2000); $(window).load(function(){ ('a.sceditor-button.sceditor-button-emoticon').click(setTimeout(function(){ $('#quickEmojInternal').contents().find("body").append('<link rel="stylesheet" id="tstyle" href="http://sd-5.archive-host.com/membres/up/22406661265772126/pour_Fa.css" type="text/css">'); },8000)); }); }); });});

mais le soucis est à l'identique.
Désolé de faire mon lourdaud sur ce coup ::moitimide::

Un grand merci à vous deux pour cette aide . je vous avouerai que je ne pensai pas rencontrer une telle résistance de la part de la couleur de fond de la boite à smileys. J'ai modifié tout ce que je voulais mais cette partie est réfractaire à toute modification.

par **Chapo** Jeu 27 Fév 2014 - 11:01

@demeter1: Je suis allé sur votre forum de test http://crevettes-passion.forumgratuit.org et ai modifié le CSS et pour moi ça fonctionne. Vous prenez un sujet et faites "Répondre" et vous avez bien le style demandé qui s'applique.

Si vous vous connectez et allez sur http://crevettes-passion.forumgratuit.org/post?t=1&mode=reply vous verrez le fond vert appliqué. Je l'ai testé sous IE (v11), Chrome (v33), Firefox (v27) et Safari (v5.1)

par medamine14 Jeu 27 Fév 2014 - 11:01

coucou, ^^

sur ton forum test j'ai vu que la réponse rapide est représenté comme celle de la réponse normal Smile

(c'est le cas pour celle de ton vrai forum aussi ?)

bon voila le code modifié :

Code:: $(function(){$("head").append('<link rel="stylesheet" type="text/css" id="tstyle" />'); if(my_getcookie("sstyle")){ $("#tstyle").attr("href",my_getcookie('sstyle'))} function addstyle(nom,lien){ $("#sstyle").append('<option value="'+lien+'">'+nom+'</option>')} $(function(){$("#frame_chatbox").load(function(){ $("#frame_chatbox").contents().find("body").append($("#tstyle").clone())}); $(function(){ setTimeout(function(){ $("iframe[src*='/smilies.forum']").contents().find("body").append('<link rel="stylesheet" id="tstyle" type="text/css">'); },2000); $(window).load(function(){ ('a.sceditor-button.sceditor-button-emoticon').click(setTimeout(function(){ $('#quickEmojInternal').contents().find("body").append('<link rel="stylesheet" id="tstyle" type="text/css">'); },8000)); }); }); });});

par demeter1 Ven 28 Fév 2014 - 11:41

Chapo a écrit:@demeter1: Je suis allé sur votre forum de test http://crevettes-passion.forumgratuit.org et ai modifié le CSS et pour moi ça fonctionne. Vous prenez un sujet et faites "Répondre" et vous avez bien le style demandé qui s'applique.

Si vous vous connectez et allez sur http://crevettes-passion.forumgratuit.org/post?t=1&mode=reply vous verrez le fond vert appliqué. Je l'ai testé sous IE (v11), Chrome (v33), Firefox (v27) et Safari (v5.1)

Bonjour Chapo,
Merci d'avoir procédé à ce test. Cependant, je pense que nous avons un petit soucis d'incompréhension.

La quasi totalité des css fournis sur ce sujets fonctionnent (y compris le votre) dans la feuille se style du forum.

Là, dans le sujet qui nous préoccupe, il s'agit d'appliquer un css via une feuille de style hébergée dans le cadre d'un sélecteur de style.

Pour tester, il suffit d'activer le sélecteur et, de choisir essai pour FA pour s'apercevoir que le style ne s'applique pas.

A titre personnel, je vous avouerai que je ne me l'explique pas et, c'est pourquoi nous sommes partis sur un probable soucis provenant du js .

medamine14 a écrit:coucou, ^^

sur ton forum test j'ai vu que la réponse rapide est représenté comme celle de la réponse normal (c'est le cas pour celle de ton vrai forum aussi ?)

bon voila le code modifié :
Code:
$(function(){$("head").append('<link rel="stylesheet" type="text/css" id="tstyle" />'); if(my_getcookie("sstyle")){ $("#tstyle").attr("href",my_getcookie('sstyle'))} function addstyle(nom,lien){ $("#sstyle").append('<option value="'+lien+'">'+nom+'</option>')} $(function(){$("#frame_chatbox").load(function(){ $("#frame_chatbox").contents().find("body").append($("#tstyle").clone())}); $(function(){ setTimeout(function(){ $("iframe[src*='/smilies.forum']").contents().find("body").append('<link rel="stylesheet" id="tstyle" type="text/css">'); },2000); $(window).load(function(){ ('a.sceditor-button.sceditor-button-emoticon').click(setTimeout(function(){ $('#quickEmojInternal').contents().find("body").append('<link rel="stylesheet" id="tstyle" type="text/css">'); },8000)); }); }); });});

Bonjour Medamine,
L'aspect de la réponse rapide est identique sur mon forum. J'ai supprimé le bouton smileys et, récupéré l'iframe du message étendu pour la mettre à côté du message rapide.

Je viens de tester à l'instant ce nouveau js. Le sélecteur n'apparait pas sur le forum. L'id (<div id="selecteur">) qui a pour but d'appeler le sélecteur n'est pas répercuté dans le js.

Milles excuses encore pour cette mauvaise nouvelle.