Accueil
Créer un forumProblème CSS adaptation à Chrome
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
Problème CSS adaptation à Chrome
par ukulola Lun 20 Juil 2015 - 11:58
Détails techniques
Version du forum : phpBB2
Poste occupé : Administrateur
Navigateur(s) concerné(s) : Google Chrome
Personnes concernées par le problème : Plusieurs utilisateurs
Lien du forum : http://age-of-heroes.forumactif.org/h1-pv-pa
Description du problème
Bonjour à tous,Comme vous pouvez le voir dans le lien que j'ai mis en copie, j'ai fait un système d'onglets pour la présentation de mon staff. Toutefois, avec le reste du staff, nous avons remarqué que ça ne fonctionnait pas sur chrome et je n'arrive pas à savoir pourquoi et où. Auriez-vous une idée?
Cordialement,
Dernière édition par ukulola le Lun 27 Juil 2015 - 23:29, édité 2 fois
ukulola- Nouveau membre
- Messages : 5
Inscrit(e) le : 20/07/2015 -
ukulola- Nouveau membre
- Messages : 5
Inscrit(e) le : 20/07/2015 -
Re: Problème CSS adaptation à Chrome
par FairyAiiro Lun 27 Juil 2015 - 17:47
Bonjour 
Le problème est tout bête.
En fait, tu inclus le script javascript indirectement grâce à :
c'est pas tip top ahah.
Il faut mieux que tu enregistres le script javascript dans une nouvelle page javascript que tu peux créer dans le pannel d'administration -> Modules -> Pages JS.
Tu mets dedans le script uniquement, et tu coches rien.
Puis, tu relèves le lien que ça te donnera une fois enregistrée et tu le mets à la place de "/h4-onglet"
.
Ou alors, tu met directement dans les balises script. Avec ce code, je suis sous chrome et je n'ai pas de souci :
Le problème est tout bête.
En fait, tu inclus le script javascript indirectement grâce à :
- Code:
<script language="javascript" src="http://beta-testeur.forumactif.com/h4-onglets">
</script>
c'est pas tip top ahah.
Il faut mieux que tu enregistres le script javascript dans une nouvelle page javascript que tu peux créer dans le pannel d'administration -> Modules -> Pages JS.
Tu mets dedans le script uniquement, et tu coches rien.
Puis, tu relèves le lien que ça te donnera une fois enregistrée et tu le mets à la place de "/h4-onglet"
. Ou alors, tu met directement dans les balises script. Avec ce code, je suis sous chrome et je n'ai pas de souci :
- Code:
<html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"><title>staff</title><style type="text/css">
/* LES ONGLETS */
.onglet{
display:inline-block;
margin-left:0px;
margin-right:0px;
padding-top:3px;
padding-bottom:3px;
cursor:pointer;}
.onglet_0{
color: #FFFFFF;
font-family: arial;
font-size: 24px;
letter-spacing: 5px;
text-shadow: 1px 1px 2px #F7D8CE;
}
.contenu_onglet{
width:160px;
height:100px;
height: auto;
display:none;
}
a:link {text-decoration: none !important;
-moz-transition: all .6s ease-in-out;
font-size:10px;
-o-transition: all .6s ease-in-out;
transition: all .6s ease-in-out;
-webkit-transition: all .6s ease-in-out;
color:#7794AE;}
a:visited {text-decoration: none !important;
-moz-transition: all .6s ease-in-out;
-o-transition: all .6s ease-in-out;
transition: all .6s ease-in-out;
font-size:10px;
-webkit-transition: all .6s ease-in-out;
color:#7794AE;}
a:active {text-decoration: none !important;
-moz-transition: all .6s ease-in-out;
-o-transition: all .6s ease-in-out;
transition: all .6s ease-in-out;
font-size:10px;
-webkit-transition: all .6s ease-in-out;
color:#7794AE;}
a:hover {text-decoration: none !important;
font-size:10px;
color:#D6D6C0;}
.cadre{
background-color: red;text-align: center; margin: 0px; padding: 0px;
}
.desc1 {
background-color: black;
border:0px solid#061524;
line-height:100%;
margin-top: 0px;
margin-bottom: 0px;
width: 160px;
height:100px;
letter-spacing: -1px;
word-spacing: 2px;
font-size:18px;
line-height: 100%;
font-family: 'Rajdhani', sans-serif;
color:#2A4D6E;
text-shadow: 0px 0px 1px ;
text-align: center;
text-transform: uppercase;}
x {color:#919191;font-family:arial;text-transform:uppercase;font-size:11px;}
x1 {color:#919191;font-family:arial;text-transform:uppercase;font-size:9px;}
y {color:#919191;
font-size:10px;
font-family:verdana;
text-transform:uppercase;
font-size:13px;}
.connor {
background-color: #f9faf5;
border-right:4px solid #F2EDDA;
border-left:4px solid #F2EDDA;
-moz-border-radius:15px;-webkit-border-radius:15px;
-moz-border-radius: 15px 15px 15px 15px;
-moz-box-shadow: 0px 0px 1px #FFFFFF;
margin-top: 0px;
margin-bottom: 0px;
width: 330px;
height: 90px;
background-image : url(http://img11.hostingpics.net/pics/828965tif.png);
}
.ephy {
background-color: #f9faf5;
border-right:4px solid #F2EDDA;
border-left:4px solid #F2EDDA;
-moz-border-radius:15px;-webkit-border-radius:15px;
-moz-border-radius: 15px 15px 15px 15px;
-moz-box-shadow: 0px 0px 1px #FFFFFF;
margin-top: 0px;
margin-bottom: 0px;
width: 330px;
height: 90px;
}
.desc2 {
background-color: #f9faf5;
border-right:4px solid #F2EDDA;
border-left:4px solid #F2EDDA;
border-bottom:1px solid #F2EDDA;
-moz-border-radius: 15px 15px 15px 15px;
-moz-box-shadow: 0px 0px 1px #FFFFFF;
-moz-border-radius:15px;-webkit-border-radius:15px;
font-family: verdana;
color:#999789;
font-size: 11px;
text-align: justify;
line-height: 12px;
margin-bottom: 0px;
margin-top: 0px;
width:330px;
height: 50px;}
.staff {
width:37px;
border:#061524 1px solid;
-moz-transition: all .7s ease-in-out;
-o-transition: all .7s ease-in-out;
transition: all .7s ease-in-out;
-webkit-transition: all .7s ease-in-out;
opacity:0.5;
margin-right: 0px;
margin-left: 0px;
align:center;
}
.staff img {
margin-right: 0px;
margin-left: 0px;
align:center;
}
.staff:hover {
background-color:grey;
margin-right: 0px;
margin-left: 0px;
align:center;
opacity:1;
}
</style><script> function change_onglet(name)
{
document.getElementById('onglet_'+anc_onglet).className = 'onglet_0 onglet';
document.getElementById('onglet_'+name).className = 'onglet_1 onglet';
document.getElementById('contenu_onglet_'+anc_onglet).style.display = 'none';
document.getElementById('contenu_onglet_'+name).style.display = 'block';
anc_onglet = name;
}
//--></script>
<link type="text/css" rel="stylesheet" href="http://fonts.googleapis.com/css?family=Rajdhani:500">
</head><body><table>
<tbody>
<tr>
<td>
<span class="onglet_0 onglet" id="onglet_groupe1" onmouseover="javascript:change_onglet('groupe1');"><a target="blank" href="http://age-of-heroes.forumactif.org/u3?tt=1"><img src="http://i.imgur.com/ykAKLfb.jpg" class="staff"></a></span>
</td>
<td>
<span class="onglet_0 onglet" id="onglet_groupe2" onmouseover="javascript:change_onglet('groupe2');"><a target="blank" href="http://age-of-heroes.forumactif.org/u18?tt=1"><img src="http://rpg.frakkingcylon.com/gallery/albums/Robert%20Downey%20Jr/013.png" class="staff"></a></span>
</td>
<td>
<span class="onglet_0 onglet" id="onglet_groupe3" onmouseover="javascript:change_onglet('groupe3');"><a target="blank" href="http://age-of-heroes.forumactif.org/u36?tt=1"><img src="https://36.media.tumblr.com/1c8056516fa8407c03f70701ff2cb5eb/tumblr_nr70tppyQn1uax6eio9_250.png" class="staff"></a></span>
</td>
<td>
<span class="onglet_0 onglet" id="onglet_groupe4" onmouseover="javascript:change_onglet('groupe4');"><a target="blank" href="http://age-of-heroes.forumactif.org/u26?tt=1"><img src="http://illiweb.com/fa/pbucket.gif" class="staff"></a></span>
</td>
</tr>
</tbody>
</table>
<div class="contenu_onglets">
<div class="contenu_onglets">
<div class="contenu_onglet" id="contenu_onglet_groupe1">
<div class="desc1">
STEVE ROGERS<br><x>administratrice</x> <br><y><a target="blank" href="http://age-of-heroes.forumactif.org/u28">ava</a> Ҩ <a target="blank" href="http://age-of-heroes.forumactif.org/u11">harry</a> Ҩ <a target="blank" href="http://age-of-heroes.forumactif.org/u35">lewis</a></y>
</div>
</div>
<div class="contenu_onglet" id="contenu_onglet_groupe2">
<div class="desc1">
TONY STARK<br><x>administratrice</x><br><y><a target="blank" href="http://age-of-heroes.forumactif.org/u19?tt=1">peter</a> Ҩ <a target="blank" href="http://age-of-heroes.forumactif.org/u29?tt=1">maxine</a></y>
</div>
</div>
<div class="contenu_onglet" id="contenu_onglet_groupe3">
<div class="desc1">
HAIKO ROSENBACH<br><x>administrateur</x> <br><y><a target="blank" href="http://age-of-heroes.forumactif.org/u2">bruce</a> Ҩ <a target="blank" href="http://age-of-heroes.forumactif.org/u13">anna</a> Ҩ <a target="blank" href="http://age-of-heroes.forumactif.org/u10">pietro</a><br><a target="blank" href="http://age-of-heroes.forumactif.org/u15">eddie</a> Ҩ <a target="blank" href="http://age-of-heroes.forumactif.org/u17">jimmy</a> Ҩ <a target="blank" href="http://age-of-heroes.forumactif.org/u38">winter</a></y>
</div>
</div>
<div class="contenu_onglet" id="contenu_onglet_groupe4">
<div class="desc1">
TAYLOR HANSEN-W.<br><x>administratrice</x><br><y><a href="http://age-of-heroes.forumactif.org/u6" target="blank">natasha</a> Ҩ <a href="http://age-of-heroes.forumactif.org/u7" target="blank">wanda</a><br><a href="http://age-of-heroes.forumactif.org/u12" target="blank">mary-jane</a> Ҩ <a href="http://age-of-heroes.forumactif.org/u14" target="blank">kitty</a> Ҩ <a href="http://age-of-heroes.forumactif.org/u16" target="blank">dylan</a><br><a href="http://age-of-heroes.forumactif.org/u32" target="blank">riley</a> Ҩ <a href="http://age-of-heroes.forumactif.org/u34" target="blank">sarah</a></y>
</div>
</div>
<div class="contenu_onglet" id="contenu_onglet_groupe5">
<div class="desc1">
ANEESH DOE<br><x>administratrice</x><br><y><a href="http://age-of-heroes.forumactif.org/u22" target="blank">victor</a> Ҩ <a href="http://age-of-heroes.forumactif.org/u23" target="blank">leopold</a><br><a href="http://age-of-heroes.forumactif.org/u33" target="blank">julian</a> Ҩ <a href="http://age-of-heroes.forumactif.org/u39" target="blank">hannibal</a></y>
</div>
</div>
<div class="contenu_onglet" id="contenu_onglet_groupe6">
<div class="desc1">
WADE WILSON<br><x>administratrice</x><br><y><a href="http://age-of-heroes.forumactif.org/u4?tt=1" target="blank">loki</a> Ҩ <a href="http://age-of-heroes.forumactif.org/u20?tt=1" target="blank">danny</a> Ҩ <a href="http://age-of-heroes.forumactif.org/u25?tt=1" target="blank">anya</a><br><a href="http://age-of-heroes.forumactif.org/u24?tt=1" target="blank">andrew</a> Ҩ <a href="http://age-of-heroes.forumactif.org/u31?tt=1" target="blank">zachariah</a></y>
</div>
</div>
<div class="contenu_onglet" id="contenu_onglet_groupe7">
<div class="desc1">
PRUDENCE DELACROIX<br><x>administratrice</x><br><y></y>
</div>
</div>
<div class="contenu_onglet" id="contenu_onglet_groupe8">
<div class="desc1">
JAMES BARNES<br><x>administrateur</x><br><y><a href="http://age-of-heroes.forumactif.org/u5?tt=1" target="blank">clint</a> Ҩ <a href="http://age-of-heroes.forumactif.org/u30?tt=1" target="blank">adamska</a></y>
</div>
</div>
</div>
</div>
<table>
<tbody>
<tr>
<td>
<span class="onglet_0 onglet" id="onglet_groupe5" onmouseover="javascript:change_onglet('groupe5');"><a target="blank" href="http://age-of-heroes.forumactif.org/u27?tt=1"><img src="http://www.pellicolascaduta.it/img/people/Riz_Ahmed+1%20dic%201982+Londra,%20Gb+-+Gb.png" class="staff"></a></span>
</td>
<td>
<span class="onglet_0 onglet" id="onglet_groupe6" onmouseover="javascript:change_onglet('groupe6');"><a target="blank" href="http://age-of-heroes.forumactif.org/u9?tt=1"><img src="http://www.cinemablend.com/timthumb.php?src=/images/news_img/67318/67318.jpg&w=100&h=100&zc=1&a=c&q=100" class="staff"></a></span>
</td>
<td>
<span class="onglet_0 onglet" id="onglet_groupe7" onmouseover="javascript:change_onglet('groupe7');"><a target="blank" href="http://age-of-heroes.forumactif.org/u21?tt=1"><img src="http://illiweb.com/fa/pbucket.gif" class="staff"></a></span>
</td>
<td>
<span class="onglet_0 onglet" id="onglet_groupe8" onmouseover="change_onglet('groupe8');"><a target="blank" href="http://age-of-heroes.forumactif.org/u8?tt=1"><img src="https://40.media.tumblr.com/9e539f846af4bc3ab24bbd58e467bf25/tumblr_inline_nnw8m15FwH1ssj0ua_540.png" class="staff"></a></span>
</td>
</tr>
</tbody>
</table>
<table>
<tbody>
<tr>
</tr>
<script type="text/javascript">
//<!--
var anc_onglet = 'groupe1';
change_onglet(anc_onglet);
//-->
</script>
</tbody>
</table></body></html>
FairyAiiro- Nouveau membre
-
Messages : 10
Inscrit(e) le : 06/07/2013 -
Re: Problème CSS adaptation à Chrome
par ukulola Lun 27 Juil 2015 - 23:29
Merci beaucoup pour la réponse rapide! J'y penserai pour la prochaine fois. 
ukulola- Nouveau membre
- Messages : 5
Inscrit(e) le : 20/07/2015 -
Sujets similaires» Problème avec l'adaptation d'un code
» Problème d'adaptation du dégradé des catégories
» Petit problème adaptation des fonds d'écran
» Problème adaptation du forum en diminuant la taille du navigateur
» Problème d'adaptation logo transparent forum (résolution écran)
» Problème d'adaptation du dégradé des catégories
» Petit problème adaptation des fonds d'écran
» Problème adaptation du forum en diminuant la taille du navigateur
» Problème d'adaptation logo transparent forum (résolution écran)
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