formulation CSS

[amazonia-piranha]

bonjour j'ai créer un lightbox mais vu que nous pouvons pas héberger du JS et CSS

pour le .JS j'ai trouvé un hébergeur
mais comment je pourrais formulé mon css pour qu'il coresponde a ma page web concerné???

voici le css concerné :

Code:


@charset "iso-8859-1";
#sb-title-inner,#sb-info-inner,#sb-loading-inner,div.sb-message{font-family:"HelveticaNeue-Light","Helvetica Neue",Helvetica,Arial,sans-serif;font-weight:200;color:#fff;}
#sb-container{position:fixed;margin:0;padding:0;top:0;left:0;z-index:999;text-align:left;visibility:hidden;display:none;}
#sb-overlay{position:relative;height:100%;width:100%;}
#sb-wrapper{position:absolute;visibility:hidden;width:100px;}
#sb-wrapper-inner{position:relative;border:1px solid #303030;overflow:hidden;height:100px;}
#sb-body{position:relative;height:100%;}
#sb-body-inner{position:absolute;height:100%;width:100%;}
#sb-player.html{height:100%;overflow:auto;}
#sb-body img{border:none;}
#sb-loading{position:relative;height:100%;}
#sb-loading-inner{position:absolute;font-size:14px;line-height:24px;height:24px;top:50%;margin-top:-12px;width:100%;text-align:center;}
#sb-loading-inner span{background:url(../shadow_img/loading.gif) no-repeat;padding-left:34px;display:inline-block;}
#sb-body,#sb-loading{background-color:#060606;}
#sb-title,#sb-info{position:relative;margin:0;padding:0;overflow:hidden;}
#sb-title,#sb-title-inner{height:26px;line-height:26px;}
#sb-title-inner{font-size:16px;}
#sb-info,#sb-info-inner{height:20px;line-height:20px;}
#sb-info-inner{font-size:12px;}
#sb-nav{float:right;height:16px;padding:2px 0;width:45%;}
#sb-nav a{display:block;float:right;height:16px;width:16px;margin-left:3px;cursor:pointer;background-repeat:no-repeat;}
#sb-nav-close{background-image:url(../shadow_img/close.png);}
#sb-nav-next{background-image:url(../shadow_img/next.png);}
#sb-nav-previous{background-image:url(../shadow_img/previous.png);}
#sb-nav-play{background-image:url(../shadow_img/play.png);}
#sb-nav-pause{background-image:url(../shadow_img/pause.png);}
#sb-counter{float:left;width:45%;}
#sb-counter a{padding:0 4px 0 0;text-decoration:none;cursor:pointer;color:#fff;}
#sb-counter a.sb-counter-current{text-decoration:underline;}
div.sb-message{font-size:12px;padding:10px;text-align:center;}
div.sb-message a:link,div.sb-message a:visited{color:#fff;text-decoration:underline;}


merci d'avance

[Ea]

Bonjour,


Vous pouvez le mettre bêtement dans PA > Affichage > Couleurs > Feuille de style, le problème ce sont les images, il faut changer tout les :

Code:

../shadow_img/loading.gif

Et truc du genre pour de bonnes adresses ^^

Sinon si c'est pour un lightbox sur les images dans les posts, j'avais déjà fait un petit script ( il y a les images directement codées dans le script ) :

Il suffit de :

1. Créer une page html ( panneau d'administration > modules > gestion des pages html ) avec le code ici.
   
   
2. Lier cette page au forum en mettant dans la description ( panneau d'administration > général > Forum | configuration > Description du site ) ceci "<script src=/h2-></script>" ( en remplaçant le 2 par le chiffre de la page html créée ).
   
   
3. Ajouter dans le CSS ( "panneau d'administration > affichage > couleurs > feuille de style" ) ce qu'il y a là ( vous pouvez modifier la première ligne qui spécifiera la hauteur ( max-height ) et la largeur ( max-width ) auxquels les images dans les messages devront être redimensionnées ).

Le résultat donne ceci : http://www.maonyn.com/t201-dessins-chats ( en cliquant sur les images elles se mettent en grand et on peut passer à la suivante / précédente ).

Cordialement.

[amazonia-piranha]

Merci j'ai fait plus simple j'ai intégré mon css dans ma page html,

mais il y a un autre probleme lorsque ma page html vient s'affiché dans le lightbox, il ya un scroll horisontale et verticale,

je croit qu'il faut intervenir sur le css mais je sais pas ou !
car je veut que l'affichage soit complet sans scroll !

avez vous une idée ?

Merci.

script actuel :

Code:


<style type="text/css">
#sb-container{position:fixed;margin:0;padding:0;top:0;left:0;z-index:999;text-align:left;visibility:hidden;display:none;}
#sb-overlay{position:relative;height:100%;width:100%;}
#sb-wrapper{position:absolute;visibility:hidden;width:100px;}
#sb-wrapper-inner{position:relative;border:1px solid #303030;overflow:hidden;height:100px;}
#sb-body{position:relative;height:100%;}
#sb-body-inner{position:absolute;height:100%;width:100%;}
#sb-player.html{height:100%;overflow:auto;}
#sb-body img{border:none;}
#sb-loading{position:relative;height:100%;}
#sb-loading-inner{position:absolute;font-size:14px;line-height:100px;height:100px;top:50%;margin-top:-12px;width:100%;text-align:center;}
#sb-loading-inner span{background:url(http://i24.servimg.com/u/f24/15/34/63/91/19-010.gif) no-repeat;padding-left:34px;display:inline-block;}
#sb-body,#sb-loading{background-color:#212121;}
#sb-title,#sb-info{position:relative;margin:0;padding:0;overflow:hidden;}
#sb-title,#sb-title-inner{height:26px;line-height:26px;}
#sb-title-inner{font-size:16px;}
#sb-info,#sb-info-inner{height:20px;line-height:20px;}
#sb-info-inner{font-size:12px;}
#sb-nav{float:right;height:16px;padding:2px 0;width:45%;}
#sb-nav a{display:block;float:right;height:16px;width:16px;margin-left:3px;cursor:pointer;background-repeat:no-repeat;}
#sb-nav-close{background-image:url(http://i24.servimg.com/u/f24/15/34/63/91/close10.png);}
#sb-counter{float:left;width:45%;}
#sb-counter a{padding:0 4px 0 0;text-decoration:none;cursor:pointer;color:#fff;}
#sb-counter a.sb-counter-current{text-decoration:underline;}
div.sb-message{font-size:12px;padding:10px;text-align:center;}
div.sb-message a:link,div.sb-message a:visited{color:#fff;text-decoration:underline;}
</style>


[Ea]

Il y a moyen de voir la page ? =D


Cordialement.

[amazonia-piranha]

problème résolu ?
merci pour ton aide Etana