formulation CSS

2 participants

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

Résolu formulation CSS

Message par amazonia-piranha Jeu 9 Juin 2011 - 19:57

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


Dernière édition par amazonia-piranha le Jeu 9 Juin 2011 - 23:04, édité 1 fois
amazonia-piranha

amazonia-piranha
***

Masculin
Messages : 195
Inscrit(e) le : 03/05/2011

http://www.amazonia-piranha.com/forum
amazonia-piranha a été remercié(e) par l'auteur de ce sujet.

Résolu Re: formulation CSS

Message par Ea Jeu 9 Juin 2011 - 21:09

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 ) :

Etana a écrit: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 ( 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.
Ea

Ea
Aidactif
Aidactif

Messages : 23583
Inscrit(e) le : 04/04/2008

Ea a été remercié(e) par l'auteur de ce sujet.

Résolu Re: formulation CSS

Message par amazonia-piranha Jeu 9 Juin 2011 - 21:44

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>
amazonia-piranha

amazonia-piranha
***

Masculin
Messages : 195
Inscrit(e) le : 03/05/2011

http://www.amazonia-piranha.com/forum
amazonia-piranha a été remercié(e) par l'auteur de ce sujet.

Résolu Re: formulation CSS

Message par Ea Jeu 9 Juin 2011 - 22:31

Il y a moyen de voir la page ? =D


Cordialement.
Ea

Ea
Aidactif
Aidactif

Messages : 23583
Inscrit(e) le : 04/04/2008

Ea a été remercié(e) par l'auteur de ce sujet.

Résolu Re: formulation CSS

Message par amazonia-piranha Jeu 9 Juin 2011 - 23:04

problème résolu ? Very Happy
merci pour ton aide Etana
amazonia-piranha

amazonia-piranha
***

Masculin
Messages : 195
Inscrit(e) le : 03/05/2011

http://www.amazonia-piranha.com/forum
amazonia-piranha 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