ya ha probado algunas cosas e no me va
tanbien no sei javascript :x pero ha tentado algunas cosas en google e hasta ahora nadie
Tengo varias dudas:

La primera, en el paso 3 hay que borrar un .css pero cual¿?
El generic.css de la carpeta inicial donde tenemos las carpetas de images y themes o alguno que hay dentro de la carpeta que hayamos elegido?¿

La segunda, en el paso 4, Agarramos el archivo CSS del slider que elegimos lo abrimos los copiamos y lo ponemos en nuestro CSS Global (esto nos facilitara para editar los css del slider a nuestro gusto), cómo se hace esto?¿

Saludos y muchas gracias!!!
El archivo js-image-slider.css o el generic.css?¿

A qué altura de mi global.css lo pongo, al final de la última palabra escrita?¿
(30 Jul, 2013, 6:08 am)storm escribió: El archivo js-image-slider.css o el generic.css?¿

A qué altura de mi global.css lo pongo, al final de la última palabra escrita?¿

La verdad es que no me acuerdo igual pone los dos Tongue
Acordarte de corregir las rutas de las imagenes de algunos css Wink
Ponelo debajo de todo.
[Imagen: https://31.media.tumblr.com/b9f3b87cfcc8...r1_500.gif]
Añado ambos al global.css y subo el html a la raíz del foro y me sale error.
En el footer de la página sale blanco y algunos textos están cambiados.

Qué puedo estar haciendo mal?¿
Última modificación: 30 Jul, 2013, 10:04 am por storm.
(30 Jul, 2013, 10:03 am)storm escribió: Añado ambos al global.css y subo el html a la raíz del foro y me sale error.
En el footer de la página sale blanco y algunos textos están cambiados.

Qué puedo estar haciendo mal?¿

Es seguro porque ai veces que los archivos css que pusiste tambien halla otro body
creo que se entiende en sentido si ai otro body te va a hacer interferencia con el body comun que ya viene puesto en mybb.
Fijate los archivos que pasaste en global css y fijate que no halla ningun css repetido con lo que viene con mybb ejemplo body.
[Imagen: https://31.media.tumblr.com/b9f3b87cfcc8...r1_500.gif]
Cuelgo el generic.css

Código:
/* For generic page styles. Not for sliders. */

body {background:#F6F6F6;font:normal 0.9em Arial; margin:0; padding:0; padding-bottom:60px;}
h2 {display:inline;}
.div1, .div2 {width:700px;margin:0 auto;}
.div1 {margin-top:30px;margin-bottom:60px;text-align:center;line-height:20px;}
.div1 P {font-size:18px;}
.div1 a, .div2 a {color:#07C; }
.div1 a {margin:0 8px;}
.div1 a.current {color:black; text-decoration:none;}
.div2 {margin-top:70px;}
.div2 li {padding-top:6px;padding-bottom:6px;}
.green {color:Green;}
.cn {font-family: "Courier New", Georgia;}
#status {display:inline-block; margin-left:26px;line-height:50px;height:50px;vertical-align:middle;}

.code
{
    border: dashed 1px #BCBCCB; padding:8px 12px; background-color: #F3F3F9; white-space:pre; font-family:"Courier New", Georgia;
    font-size:12px; margin:6px 0;overflow:auto;
}

El js-image-slider.css:

Código:
/* http://www.menucool.com */

#sliderFrame {position:relative;width:700px;margin: 0 auto;}
  
#slider {
    width:700px;height:306px;/* Make it the same size as your images */
    background:#fff url(loading.gif) no-repeat 50% 50%;
    position:relative;
    margin:0 auto; /*this makes the image slider center-aligned. Remove this line if you want to align the whole slider to the left side*/
    box-shadow: 0px 1px 5px #999999;
}
#slider img, #slider>b, #slider a>b{
    position:absolute;
    border:none;
    display:none;
}
#slider>a {display:none;}

/* the link style (if an image is wrapped in a link) */
#slider a.imgLink {
    z-index:2;
    position:absolute;
    top:0px;left:0px;border:0;padding:0;margin:0;
    width:100%;height:100%;
}
#slider a.video {
    background:transparent url(video.png) no-repeat 50% 50%;
}

/* Caption styles */
div.mc-caption-bg, div.mc-caption-bg2 {
    position:absolute;
    width:100%;
    height:auto;
    padding:0;
    left:0px; /*if the caption needs to be aligned from right, specify by right instead of left. i.e. right:20px;*/
    bottom:0px;/*if the caption needs to be aligned from top, specify by top instead of bottom. i.e. top:150px;*/
    z-index:3;
    overflow:hidden;
    font-size: 0;
}
div.mc-caption-bg {
    background-color:black;
}
div.mc-caption-bg2 {
    background:none;
}
div.mc-caption {
    font: bold 14px/20px Arial;
    color:#EEE;
    z-index:4;
    padding:10px 0;/*Adding a padding-left or padding-right here will make the caption area wider than its background. Sometimes you may need to define its width again here to keep it the same width as its background area (div.mc-caption-bg).*/
    text-align:center;
    background:none;
}
div.mc-caption a {
    color:#FB0;
}
div.mc-caption a:hover {
    color:#DA0;
}


/* ------ built-in navigation bullets wrapper ------*/
div.navBulletsWrapper  {
    top:320px; left:280px; /* Its position is relative to the #slider */
    width:150px;
    background:none;
    padding-left:20px;
    position:relative;
    z-index:5;
    cursor:pointer;
}

/* each bullet */
div.navBulletsWrapper div
{
    width:11px; height:11px;
    background:transparent url(bullet.png) no-repeat 0 0;
    float:left;overflow:hidden;vertical-align:middle;cursor:pointer;
    margin-right:11px;/* distance between each bullet*/
    _position:relative;/*IE6 hack*/
}

div.navBulletsWrapper div.active {background-position:0 -11px;}


/* --------- Others ------- */
#slider
{
    transform: translate3d(0,0,0);
    -ms-transform:translate3d(0,0,0);
    -moz-transform:translate3d(0,0,0);
    -o-transform:translate3d(0,0,0);
}

.loading
{
    width:100%; height:100%;
    background:transparent url(loading.gif) no-repeat 50% 50%;
    filter: alpha(opacity=60);
    opacity:0.6;
    position:absolute;
    left:0;
    top:0;
    z-index:9;
}
(30 Jul, 2013, 4:33 pm)storm escribió: Cuelgo el generic.css

Código:
/* For generic page styles. Not for sliders. */

body {background:#F6F6F6;font:normal 0.9em Arial; margin:0; padding:0; padding-bottom:60px;}
h2 {display:inline;}
.div1, .div2 {width:700px;margin:0 auto;}
.div1 {margin-top:30px;margin-bottom:60px;text-align:center;line-height:20px;}
.div1 P {font-size:18px;}
.div1 a, .div2 a {color:#07C; }
.div1 a {margin:0 8px;}
.div1 a.current {color:black; text-decoration:none;}
.div2 {margin-top:70px;}
.div2 li {padding-top:6px;padding-bottom:6px;}
.green {color:Green;}
.cn {font-family: "Courier New", Georgia;}
#status {display:inline-block; margin-left:26px;line-height:50px;height:50px;vertical-align:middle;}

.code
{
    border: dashed 1px #BCBCCB; padding:8px 12px; background-color: #F3F3F9; white-space:pre; font-family:"Courier New", Georgia;
    font-size:12px; margin:6px 0;overflow:auto;
}

El js-image-slider.css:

Código:
/* http://www.menucool.com */

#sliderFrame {position:relative;width:700px;margin: 0 auto;}
  
#slider {
    width:700px;height:306px;/* Make it the same size as your images */
    background:#fff url(loading.gif) no-repeat 50% 50%;
    position:relative;
    margin:0 auto; /*this makes the image slider center-aligned. Remove this line if you want to align the whole slider to the left side*/
    box-shadow: 0px 1px 5px #999999;
}
#slider img, #slider>b, #slider a>b{
    position:absolute;
    border:none;
    display:none;
}
#slider>a {display:none;}

/* the link style (if an image is wrapped in a link) */
#slider a.imgLink {
    z-index:2;
    position:absolute;
    top:0px;left:0px;border:0;padding:0;margin:0;
    width:100%;height:100%;
}
#slider a.video {
    background:transparent url(video.png) no-repeat 50% 50%;
}

/* Caption styles */
div.mc-caption-bg, div.mc-caption-bg2 {
    position:absolute;
    width:100%;
    height:auto;
    padding:0;
    left:0px; /*if the caption needs to be aligned from right, specify by right instead of left. i.e. right:20px;*/
    bottom:0px;/*if the caption needs to be aligned from top, specify by top instead of bottom. i.e. top:150px;*/
    z-index:3;
    overflow:hidden;
    font-size: 0;
}
div.mc-caption-bg {
    background-color:black;
}
div.mc-caption-bg2 {
    background:none;
}
div.mc-caption {
    font: bold 14px/20px Arial;
    color:#EEE;
    z-index:4;
    padding:10px 0;/*Adding a padding-left or padding-right here will make the caption area wider than its background. Sometimes you may need to define its width again here to keep it the same width as its background area (div.mc-caption-bg).*/
    text-align:center;
    background:none;
}
div.mc-caption a {
    color:#FB0;
}
div.mc-caption a:hover {
    color:#DA0;
}


/* ------ built-in navigation bullets wrapper ------*/
div.navBulletsWrapper  {
    top:320px; left:280px; /* Its position is relative to the #slider */
    width:150px;
    background:none;
    padding-left:20px;
    position:relative;
    z-index:5;
    cursor:pointer;
}

/* each bullet */
div.navBulletsWrapper div
{
    width:11px; height:11px;
    background:transparent url(bullet.png) no-repeat 0 0;
    float:left;overflow:hidden;vertical-align:middle;cursor:pointer;
    margin-right:11px;/* distance between each bullet*/
    _position:relative;/*IE6 hack*/
}

div.navBulletsWrapper div.active {background-position:0 -11px;}


/* --------- Others ------- */
#slider
{
    transform: translate3d(0,0,0);
    -ms-transform:translate3d(0,0,0);
    -moz-transform:translate3d(0,0,0);
    -o-transform:translate3d(0,0,0);
}

.loading
{
    width:100%; height:100%;
    background:transparent url(loading.gif) no-repeat 50% 50%;
    filter: alpha(opacity=60);
    opacity:0.6;
    position:absolute;
    left:0;
    top:0;
    z-index:9;
}

Espero que se te solucione
El css de generic borralo todo y se te debe solucionar el deforme con el foro.

PD: si vez el css generic ai un css que se llama body con lo que te dije te debes dar cuenta..
[Imagen: https://31.media.tumblr.com/b9f3b87cfcc8...r1_500.gif]
Última modificación: 30 Jul, 2013, 5:37 pm por fabiibiografiia.
He puesto sólo el js-image-slider.css.
Ahora no me sale nada raro.

Luego pongo el archivo demo6 (el html) dentro de la raíz del foro?¿
Es que lo coloco y no sale nada en el foro.
Hay que ponerlo en otro sitio o cambiarlo el nombre?¿