Transparence sur le bloc "Body" des news.

Voir le sujet précédent Voir le sujet suivant Aller en bas

Résolu Transparence sur le bloc "Body" des news.

Message par Colthomas le Jeu 13 Jan 2011 - 1:45

Bonsoir à tous ! rabbit
J'ai besoin d'un petit coup de main concernant l'affichage de mes news sur le portail. Plus précisément sur le bloc contenant le contenu de la news (hors titre et barre de commentaires), j'aimerai y ajouter un effet de transparence.

Voila ce que je tente de faire :

Avant :

Spoiler:

Aprés

Spoiler:

(A noter que la transparence ne s'effectue que sur le cadre de texte.)

J'ai chercher comment faire, puis ai trouvé ce code qui s'applique sur la feuille de style CSS mais dans ce cas la transparence prend effet sur tout le forum.

Code:
body {
filter:alpha(opacity=85);
-moz-opacity:0.85;
-khtml-opacity: 0.85;
opacity: 0.85;
}

Donc j'ai essayé de l'insérer sur le CSS des news (mod_news) mais je vois pas comment. Je vous refile mon code car c'est un template déjà modifié ! Pour info je suis en PunBB.

Spoiler:
Code:
<!-- BEGIN post_row -->
<!-- BEGIN saut -->
<div style="height:40px"></div>
<!-- END saut -->
<div class="module main">
   <a name="news_{post_row.ID}"></a>

   <div class="module mod_news">
      <div class="main-head" style="text-align:{LEFT};">{post_row.TITLE}</div>
<img src="http://i34.servimg.com/u/f34/14/84/87/27/bfbc2_11.jpg">
      <div class="main-content" style="padding:0;">
         
         <div class="body">


            {post_row.TEXT}


            <!-- BEGIN switch_attachments -->
            <dl class="attachbox">
               <dt>{post_row.switch_attachments.L_ATTACHMENTS}</dt>
               <dd>
                  <!-- BEGIN switch_post_attachments -->
                  <dl class="file">
                     <dt>
                        <img src="{post_row.switch_attachments.switch_post_attachments.U_IMG}" />

                        <!-- BEGIN switch_dl_att -->
                        <a class="postlink" href="{post_row.switch_attachments.switch_post_attachments.switch_dl_att.U_ATTACHMENT}">{post_row.switch_attachments.switch_post_attachments.switch_dl_att.ATTACHMENT}</a> {post_row.switch_attachments.switch_post_attachments.switch_dl_att.ATTACHMENT_DEL}
                        <!-- END switch_dl_att -->

                        <!-- BEGIN switch_no_dl_att -->
                        {post_row.switch_attachments.switch_post_attachments.switch_no_dl_att.ATTACHMENT} {post_row.switch_attachments.switch_post_attachments.switch_no_dl_att.ATTACHMENT_DEL}
                        <!-- END switch_no_dl_att -->
                     </dt>

                     <!-- BEGIN switch_no_comment -->
                     <dd>
                        <em>{post_row.switch_attachments.switch_post_attachments.switch_no_comment.ATTACHMENT_COMMENT}</em>
                     </dd>
                     <!-- END switch_no_comment -->

                     <!-- BEGIN switch_no_dl_att -->
                     <dd>
                        <em><strong>{post_row.switch_attachments.switch_post_attachments.switch_no_dl_att.TEXT_NO_DL}</strong></em>
                     </dd>
                     <!-- END switch_no_dl_att -->

                     <dd>({post_row.switch_attachments.switch_post_attachments.FILE_SIZE}) {post_row.switch_attachments.switch_post_attachments.NB_DL}</dd>
                  </dl>
                  <!-- END switch_post_attachments -->
               </dd>
            </dl>
            <!-- END switch_attachments -->
            <div class="clear"></div>
            {post_row.OPEN}<a href="{post_row.U_READ_FULL}">{post_row.L_READ_FULL}</a>{post_row.CLOSE}
         </div>
         


      </div>
   </div>

</div>
<a href="{post_row.U_VIEW_COMMENTS}"><IMG src="http://i34.servimg.com/u/f34/14/84/87/27/sans_t32.jpg"></a>
<!-- END post_row -->

<!-- BEGIN switch_image_resize -->
<script type="text/javascript">
//<![CDATA[
$(resize_images({ 'selector' : '.mod_news', 'max_width' : {switch_image_resize.IMG_RESIZE_WIDTH}, 'max_height' : {switch_image_resize.IMG_RESIZE_HEIGHT} }));
//]]>
</script>
<!-- END switch_image_resize -->

Merci de vos futurs réponses en espérant que quelqu'un arrivera à m'aider Smile


Dernière édition par Colthomas le Jeu 13 Jan 2011 - 15:57, édité 1 fois

Colthomas
*

Masculin
Messages : 37
Inscrit(e) le : 07/04/2010

http://bfbc-communaute.max2forum.com
Colthomas a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Transparence sur le bloc "Body" des news.

Message par Colthomas le Jeu 13 Jan 2011 - 12:23

Petit up du jour Exclamation

Colthomas
*

Masculin
Messages : 37
Inscrit(e) le : 07/04/2010

http://bfbc-communaute.max2forum.com
Colthomas a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Transparence sur le bloc "Body" des news.

Message par Anzu le Jeu 13 Jan 2011 - 12:27

Bonjour et Bienvenue
sur le Forum des Forums ForumActif
Vu que vous êtes nouveau, voici quelques sujets importants :
Sécurité : Mail de fondation - Ce qu'il ne faut pas faire
Listing - Questions/Réponses fréquentes
Listing - Trucs et astuces
La fonction Rechercher
La FAQ de Forumactif.com

N'hésitez pas à ouvrir un nouveau sujet si vous ne trouvez pas votre réponse Wink


Bonjour,

Je vous rappelle qu'il est autorisé un seul UP par tranche de 24 heures, à partir de votre dernier message posté dans le sujet concerné.

Je vous invite à lire :

A bientôt sur ForumActif Smile

Anzu
+ Hyperactif +

Féminin
Messages : 20685
Inscrit(e) le : 30/08/2007

http://forum.forumactif.com/forum
Anzu a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Transparence sur le bloc "Body" des news.

Message par Colthomas le Jeu 13 Jan 2011 - 15:57

J'ai finalement réussi à appliquer la transparence moi même grâce à ce Tutoriel

Comment rendre le DIV ainsi que le contenu transparent ?

Le div lui même sera transparent, mais aussi l'ensemble du contenu tel que les images ou le texte.

Code:
<div style="filter:alpha(opacity=50); opacity:0.5;">........</div>

La propriété opacity est prise en compte par firefox 3+, Chrome 2+, Safari 4 (pas testé 3) ainsi que Opera 10. La propriété filter:alpha(opacity=50) permet à Internet Explorer 8 (pas 7) et Opera 9.x de rendre la transparence.

Colthomas
*

Masculin
Messages : 37
Inscrit(e) le : 07/04/2010

http://bfbc-communaute.max2forum.com
Colthomas a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut


Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum