Sujets similaires

Bonjour... ou bonsoir ( je poste le soir donc bon... u.u qu'importe ><)

Bon, voilà mon problème...
Sur un forum ou je suis Administrateur, j'ai modifié des Templates et des CSS pour obtenir un effet d'oppacité Graduel. Avec Firefox, aucun problème. Pourtant, certains membres m'ont fait remarqué que les avatars étaient coupé de moitié, ce qui cause un réel problème. C'est pour ceux qui utilise Internet Explorer, parce qu'avec Chrome et Firefox, aucun problème.

Voici un aperçut:

Spoiler:

Comme vous le voyez sur l'image, ça coupe au niveau du nez du personnage, et l'avatar se poursuit pourtant plus loin... c'est un réel problème u.u

J'ai sans doute fait une erreur dans les Templates, ou ailleurs, ou c'est explorer le problème... je sais pas trop. Donc mon CSS pour l'oppacité:

Spoiler:

Pour mon Template:

Spoiler:

Code:: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html dir="{S_CONTENT_DIRECTION}" id="min-width" lang="{L_LANG_HTML}" xml:lang="{L_LANG_HTML}" xmlns="http://www.w3.org/1999/xhtml">
<head>

<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />

<title>{SITENAME_TITLE}{PAGE_TITLE}</title>
<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" />
{META_FAVICO}
{META}
<meta name="title" content="{SITENAME_TITLE}{PAGE_TITLE}" />
{T_HEAD_STYLESHEET}
{CSS}
<link rel="search" type="application/opensearchdescription+xml" href="/improvedsearch.xml" title="{SITENAME}" />
<link rel="search" type="application/opensearchdescription+xml" href="{URL_BOARD_DIRECTORY}/search/improvedsearch.xml" title="{SEARCH_FORUMS}" />
<script src="{JS_DIR}{L_LANG}.js" type="text/javascript"></script>

<script src="{JS_DIR}jquery/ticker/ticker.js" type="text/javascript"></script>
<link type="text/css" rel="stylesheet" href="{JS_DIR}jquery/ticker/ticker.css" />

<script type="text/javascript">
//<![CDATA[
$(document).ready(function(){

pm = window.open('{U_PRIVATEMSGS_POPUP}', '_faprivmsg', 'HEIGHT=225,resizable=yes,WIDTH=400');
pm.focus();


report = window.open('{switch_report_popup.U_REPORT_POPUP}', '_phpbbreport', 'HEIGHT={switch_report_popup.S_HEIGHT},resizable=yes,scrollbars=no,WIDTH={switch_report_popup.S_WIDTH}');
report.focus();


ticker_start({switch_ticker.HEIGHT}, {switch_ticker.SPACING}, {switch_ticker.SPEED}, '{switch_ticker.DIRECTION}', {switch_ticker.STOP_TIME});

});


var logInPopUpLeft, logInPopUpTop, logInPopUpWidth = {LOGIN_POPUP_WIDTH}, logInPopUpHeight = {LOGIN_POPUP_HEIGHT}, logInBackgroundResize = false, logInBackgroundClass = false;

//]]>
</script>
{GREETING_POPUP}

<style type="text/css">
#hitskin_preview {
margin: 0; padding: 0;
position: fixed;
top: 0; left: 0;
width: 100%;
height: 65px;
background: url('http://2img.net/i/fa/hitskin/hitskin_bar.png') repeat-x left -15px;
color: #fff;
}
* html #hitskin_preview { /* Fix for IE6 since it doesn't implement fixed positionning */
position: absolute;
top:expression(eval(document.compatMode && document.compatMode=='CSS1Compat') ? documentElement.scrollTop : document.body.scrollTop);
z-index: 2;
background: transparent url('http://2img.net/i/fa/hitskin/hitskin_bar-ie6.gif') repeat-x left -15px;
}
* html { /* Gunlaug's Speed fix for the above positionning fix. Sorry for the fix for the fix */
background: #fff url(foo) fixed;
}
#hitskin_preview h1 {
float: left;
margin: 3px 0 0 0;
padding: 0 0 0 10px;
font: italic normal 25px Arial,sans serif;
color: #fff;
}
#hitskin_preview h1 img {
vertical-align: middle;
}
#hitskin_preview em {
color: #7CBA2C;
font-weight: bold;
}
#hitskin_preview a {
color: #fff;
}
#hitskin_preview a:hover {
text-decoration: underline;
}

#hitskin_preview .content {
text-align: right;
}
#hitskin_preview .content p {
margin: 4px 1em 0px 1em;
font-size: 13px;
line-height: 1.8em;
color: #fff;
font-weight: bold;
}
#hitskin_preview .content p span {
font-weight: normal;
font-size: 0.8em;
}
body {
margin-top: 40px !important;
}
{hitskin_preview.HITSKIN_RTL_CSS}
</style>

<script type="text/javascript" src="http://narutolegend.franceserv.com/css-actif/effet1/core2.js"> </script>

<script type="text/javascript">
(function($) {
$obj = $('.opacity');

$obj.css({opacity: .5}).hover(function() {
$(this).stop().animate({ "opacity" : 0.1 });
}, function() {
$(this).stop().animate({ "opacity" : .5 });
});

})(jQuery);
</script>
<script type="text/javascript">
jQuery(document).ready(function(){
jQuery('.opacity').each(function() {
jQuery(this).fadeTo(0,0.1);
jQuery(this).mouseenter(function(){jQuery(this).stop();jQuery(this).fadeTo('normal',1);});
jQuery(this).mouseleave(function(){jQuery(this).stop();jQuery(this).fadeTo('normal',0.1);});
});
});
</script>
</head>
<body background="{T_BODY_BACKGROUND}" bgcolor="{T_BODY_BGCOLOR}" text="{T_BODY_TEXT}" link="{T_BODY_LINK}" vlink="{T_BODY_VLINK}">

<div id="hitskin_preview" style="display: block;">
<h1><img src="http://2img.net/i/fa/hitskin/hitskin_logo.png" alt="" /> Hit<em>skin</em>.com</h1>
<div class="content">
<p>
{hitskin_preview.L_THEME_SITE_PREVIEW}
<br />
<span>{hitskin_preview.U_INSTALL_THEME}<a href="http://{hitskin_preview.U_RETURN_THEME}">{hitskin_preview.L_RETURN_THEME}</a></span>
</p>
</div>
</div>



<div id="login_popup">
<table class="forumline" width="{LOGIN_POPUP_WIDTH}" height="{LOGIN_POPUP_HEIGHT}" border="0" cellspacing="1" cellpadding="0">
<tr height="25">
<td class="catLeft">
<span class="genmed module-title">{SITENAME}</span>
</td>
</tr>
<tr height="{LOGIN_POPUP_MSG_HEIGHT}">
<td class="row1" align="center" valign="top">
<div id="login_popup_buttons">
<form action="{S_LOGIN_ACTION}" method="get">
<input type="submit" class="mainoption" value="{L_LOGIN}" />
<input type="button" class="mainoption" value="{L_REGISTER}" onclick="parent.location='{U_REGISTER}';" />
<input id="login_popup_close" type="button" class="button" value="{L_DONT_DISPLAY_AGAIN}" />
</form>
</div>
<span class="genmed">{LOGIN_POPUP_MSG}</span>
</td>
</tr>
</table>
</div>


<a name="top"></a>
{JAVAscript}
<table width="100%" cellspacing="0" cellpadding="0" border="0">
<tr>

<td><a href="{U_INDEX}"><img src="{LOGO}" id="i_logo" border="0" alt="{L_INDEX}" vspace="1" /></a></td>
<td align="center" width="100%" valign="middle">
<div class="maintitle">{MAIN_SITENAME}</div>
<br />
<span class="gen">{SITE_DEscriptION}<br /> </span>
</td>



<td align="center" width="100%" valign="middle">
<a href="{U_INDEX}"><img src="{LOGO}" id="i_logo" border="0" alt="{L_INDEX}" vspace="1" /></a><br />
<div class="maintitle">{MAIN_SITENAME}</div>
<br />
<span class="gen">{SITE_DEscriptION}</span>
</td>



<td align="center" width="100%" valign="middle">
<div class="maintitle">{MAIN_SITENAME}</div>
<br />
<span class="gen">{SITE_DEscriptION}<br /> </span>
</td>
<td>
<a href="{U_INDEX}"><img src="{LOGO}" id="i_logo" border="0" alt="{L_INDEX}" vspace="1" /></a>
</td>

</tr>
</table>
<table class="bodylinewidth" width="{T_BODY_TABLE_WIDTH}" cellspacing="0" cellpadding="10" border="0" align="center">
<tr>
<td class="bodyline">

<table cellspacing="0" cellpadding="0" border="0" align="{MENU_POSITION}">
<tr>
<td align="{MENU_POSITION}"{MENU_NOWRAP}>{GENERATED_NAV_BAR}</td>
</tr>
</table>

<div style="clear: both;"></div>


<div id="fa_ticker_block" style="margin-top:4px;margin-bottom:4px;">
<table width="100%" border="0" cellspacing="0" cellpadding="0" class="forumline">
<tr>
<td {CLASS_TABLE_TYPE} align="left" class="row1">
<div id="fa_ticker_container">
<div id="fa_ticker" style="height:{switch_ticker.HEIGHT}px;">
<div class="fa_ticker_content">

<div>{switch_ticker.ticker_row.ELEMENT}</div>

</div>
</div>
</div>
</td>
</tr>
</table>
</div>


<div id="page-body">
<div id="{ID_CONTENT_CONTAINER}"{CLASS_CONTENT_CONTAINER}>
<table cellpadding="0" cellspacing="0" width="100%" class="three-col">
<tbody>
<tr>
<td valign="top" width="{C1SIZE}">
<div id="{ID_LEFT}">

{giefmod_index1.MODVAR}

<div style="height:{SPACE_ROW}px"></div>


</div>
</td>
<td valign="top" width="100%">

</td>
</tr>
</tbody>
</table>
</div>
</div>
</td>
</tr>
</table>
</body>
</html>

Ce que j'avais modifié dans ce Template :

Code:: <script type="text/javascript">
(function($) {
$obj = $('.opacity');

$obj.css({opacity: .5}).hover(function() {
$(this).stop().animate({ "opacity" : 0.1 });
}, function() {
$(this).stop().animate({ "opacity" : .5 });
});

})(jQuery);
</script>
<script type="text/javascript">
jQuery(document).ready(function(){
jQuery('.opacity').each(function() {
jQuery(this).fadeTo(0,0.1);
jQuery(this).mouseenter(function(){jQuery(this).stop();jQuery(this).fadeTo('normal',1);});
jQuery(this).mouseleave(function(){jQuery(this).stop();jQuery(this).fadeTo('normal',0.1);});
});
});
</script>

Je sais pas où ça fait défaut dans ce que j'ai rajouté, et ça m'énerve vraiment >.<
Avec Explorer, on est pas censé de ne pas voir les effets d'opacité?

Je suis dans la totale incompréhension :S

Merci à la personne qui m'aidera Wink

Si j'ai oublié quelque chose, n'hésitez pas ( je suis fatiguée et j'oublie plein de truc crucial u.u alors c'est normal si ça ressemble à du charabia ce que je dis... u.u )

Sujet: Re: Avatar coupé de moitié Oo Mar 07 Sep 2010, 10:04

Bonjour,

Votre problème est-il résolu ?
Si oui, merci de cocher dans "icône du sujet" l'icône Avatar coupé de moitié Oo 87671resolu3

en éditant votre 1er post.

Sujet: Re: Avatar coupé de moitié Oo Mar 07 Sep 2010, 19:39

Non, mon problème n'est toujours pas résolut ^^
;P

Sujet: Re: Avatar coupé de moitié Oo Mer 08 Sep 2010, 08:36

Alors déjà, je ne sais pas si c'est la cause, mais tu as ceci dans ton code:

Code:: $obj.css({opacity: .5}).hover(function() {
$(this).stop().animate({ "opacity" : 0.1 });
}, function() {
$(this).stop().animate({ "opacity" : .5 });
});

Pourquoi .5?Ce n'est pas plutôt 0.5?

Et ensuite, pourquoi avoir un code css séparé si ce n'est pas le même que celui de ton template?

Et dernière chose, pourquoi se compliquer la vie xD si tu voulais juste mettre de l'opacité sur ton avatar, il te suffisait de garder le css que tu as mis, et d'entourer la balise de l'avatar par:

Code:: <span class="opacity">BALISE</span>

Bisous~

Sujet: Re: Avatar coupé de moitié Oo Ven 10 Sep 2010, 21:31

J'ai essayer de taponner, sauf que ça ne change rien ^^ Je voulais l'effet d'opacité sur tout les avatars du forum, par juste le mien ( sinon je sais pas comment le dire, désolée >o<)

Et c'est là que tout plante. J'avais déjà essayé plusieurs codes données sur le forum, et c'était finalement ce que j'ai donné en haut qui fonctionnait u.u je comprend plus rien xD

Sinon, c'est vraiment le template qui bugue >< (chaque fois que je le change, le reste plante ¬¬)

Sinon bon, je laisserai faire si rien fonctionne...

Pourquoi faire ça simple quand ça peut être compliqué XD

EDIT: j'ai oublié de dire que mettre les " 0 " manquant ne changeait rien >< l'avatar est toujours coupé :S Et ça ne le fait que sur Internet explorer i.i

Sujet: Re: Avatar coupé de moitié Oo Sam 11 Sep 2010, 06:47

Il faut savoir que Internet Explorer [I.E] est largement en retard en ce qui concerne la reconnaissance des balises CSS, la reconnaissance du javascript également..

Il faut donc penser que c'est I.E qui ne reconnait pas correctement le script utiliser.

Sujet: Re: Avatar coupé de moitié Oo Ven 17 Sep 2010, 14:24

Bonjour,

Votre problème est-il résolu ?
Si oui, merci de cocher dans "icône du sujet" l'icône Avatar coupé de moitié Oo 87671resolu3

en éditant votre 1er post.

Sujet: Re: Avatar coupé de moitié Oo Ven 17 Sep 2010, 16:00

Non, du tout =o=' Je sais toujours juste pas comment arrangé ça <.< J'ai vu sur un forum dont je suis membre, que sur internet explorer ça ne fonctionnait pas ( l'effet d'oppacité tout court) alors que sur le mien, l'avatar se coupe de moitié sans but... ><' Et je veux pas enlever l'effet graduel après tout le temps que j'ai cherché comment le faire -_-'

Enfin, bref... si personne est capable de me répondre je tenterai de me débrouiller Razz

Sujet: Re: Avatar coupé de moitié Oo Ven 24 Sep 2010, 11:35

Bonjour,

Votre problème est-il résolu ?
Si oui, merci de cocher dans "icône du sujet" l'icône Avatar coupé de moitié Oo Resolu3

en éditant votre 1er post.

Avatar coupé de moitié Oo

Avatar coupé de moitié Oo

Sujets similaires

Sujets similaires

Partenaires Or