Problema galería html5

[Neocim]

Muy buenas,que tal.
Lo primero de todo,quiero deciros que soy un novato en este mundo,lo mio es más el mundo audiovisual.
He buscado tanto en google como en vuestro buscador lo que os voy a comentar,pero no he encontrado nada.

La cuestión es que me estoy haciendo una web de vídeo y fotografía,basándome en una palntilla html5.

El problema que tengo,es que al poner vídeos o imágenes,llega un punto en el que me quedo "sin pantalla" (por así decirlo) en la galería. En mi ignorancia he supuesto que habría que añadir un scroll o algo así,pero no tengo ni idea

Os dejo una captura de pantalla a ver si entendéis a qué me refiero. Si os fijáis,el tercer vídeo está cortado. Cómo puedo solucionarlo?

Cuaquier tipo de ayuda me vendría genial...gracias!!

[C2am]

Hola
Puedes poner un enlace para ver cual es el problema?

[Neocim]

Buenas, no se ve la imagen insertada?
La web aún no está activa,ya que quiero solucionar esto antes.

es esta http://i.imgur.com/3bK4nlJ.jpg

Como ves,el tercer vídeo está cortado,y no hay forma de bajar esa ventana. Así que por más vídeos que agrego,no se llegan a ver.

He estado repasando todo el código junto a un amigo que tiene nociones (básicas) sobre html pero no hemos sabido dar con el problema.

Si necesitáis que os pegue algún código en concreto decidmelo.

Muchísimas gracias

[pzin]

A lo que se refiere C2am es que, al igual que hiciste con tu amigo, sin código poco te podemos decir, ya que, una línea de código dice más que mil imágenes.

[Neocim]

Vale,lo siento.
Así es como tengo el código de la ventan emergente de vídeos,creo que es lo que necesitáis. Me he revisado la capa Style por si tuviese algo que ver,ahí estoy un poco más perdido.

(Lo de "page_About" es porque luego fue cambiado a Multimedia y no le cambié lo de About,error de novato supongo,pero funciona...jajaja)

Código HTML:

<li id="page_About">
								<div class="box1">
									<div class="inner">
										<a href="#" class="close" data-type="close"><span></span></a>
										<h2>Videos</h2>
										<div class="wrapper">
                                        	<iframe src="http://player.vimeo.com/video/57013867" width="500" height="281" frameborder="0" webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe> <p><a href="http://vimeo.com/57013867">City Of London</a> from <a href="http://vimeo.com/kolo1">Kolocon</a> on <a href="http://vimeo.com">Vimeo</a>.</p>
										</div>
										<p class="pad_bot1"><iframe src="http://player.vimeo.com/video/57518700" width="500" height="281" frameborder="0" webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe> <p><a href="http://vimeo.com/57518700">Casa Vejo</a> from <a href="http://vimeo.com/kolo1">Kolocon</a> on <a href="http://vimeo.com">Vimeo</a>.</p></p>
										<ul class="list2 pad_bot1">
											<iframe src="http://player.vimeo.com/video/52261007" width="500" height="281" frameborder="0" webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe> <p><a href="http://vimeo.com/52261007">Six Eyes</a> from <a href="http://vimeo.com/kolo1">Kolocon</a> on <a href="http://vimeo.com">Vimeo</a>.</p>
										</ul>
									</div>
								</div>
							</li> 

[pzin]

Bueno, hay ahí unos errores que no tienen que ver con el problema, como meter un marco en linea dentro de un párrafo.

De todas formas, esa parte no nos dice nada, o más bien poco, porque no sabemos qué estilos afectan a div#page_About.

Tampoco estaría de más que al postear código lo dejaras indentado de forma más ordenada, ya que cuesta un poco leerlo de esa forma.

De paso bienvenido al foro.

[Neocim]

Iniciado por pzin

Bueno, hay ahí unos errores que no tienen que ver con el problema, como meter un marco en linea dentro de un párrafo.

De todas formas, esa parte no nos dice nada, o más bien poco, porque no sabemos qué estilos afectan a div#page_About.

Tampoco estaría de más que al postear código lo dejaras indentado de forma más ordenada, ya que cuesta un poco leerlo de esa forma.

De paso bienvenido al foro.

Ya,imagino que estará lleno de errores...la verdad es que me gustaría meterme en todo este mundo de programación web más a fondo.
Por ejemplo,creo que no sabría indicarte que estilos afectan a div#page_About como me pides.

Aunque igual esto sirve de algo.
La galería en el código se muestra como lightbox,no?

En la capa Style, sobre lightbox tengo lo siguiente:

Código CSS:

/* Lightbox image */
.lightbox-image {position:relative;overflow:hidden;display:block;
background:#fff;z-index:1}
.lightbox-image img {position:relative;z-index:1}
.lightbox-image > span {display:block;position:absolute;left:0;top:0;width:100%;height:100%;
background:url(../images/border.gif) 0 0
no-repeat;z-index:2}
.pp_details {height:0;padding:0;margin:0;font-size:0;line-height:0;
visibility:visible !important}
.pp_description {display:none;height:0;padding:0;margin:0;font-size:0;line-height:0}
.pp_close {position:absolute;z-index:99;top:-30px;right:0;display:none !important}
div.light_square .pp_next {position:absolute;top:48%;right:-68px;width:35px;height:35px;
background:url(../images/marker_right.gif) 
left top no-repeat;visibility:visible !important}
div.light_square .pp_next:hover {background-position:bottom}
div.light_square .pp_previous {position:absolute;top:48%;left:-68px;width:35px;height:35px;
background:url(../images/marker_left.gif) 
left top no-repeat;visibility:visible !important}
div.light_square .pp_previous:hover {background-position:bottom}
.pp_arrow_previous, .pp_arrow_next {display:none !important}
.link1 {color:#fff;text-decoration:none}
.link1:hover {text-decoration:underline}
 

He probado a cambiar el Overflow a "auto" y "scroll",pero no le afecta en nada.

Espero que así se te haya hecho más fa´cil de verlo.

Y de verdad,perdonad mi ignorancia,si supiese dónde estoy parado ya podríais haberme resuelto la duda,pero entre que no se explicarme y me lio con los códigos... xD

Gracias por la bienvenida,espero quedarme para largo :D

[pzin]

Si vas pegando trozos de código que no sabes ni de qué son ni a qué vienen nos va a pasar la tarde aquí.

Ya lo último, es que pases un enlace a donde lo tengas colgado.

Lo de meterte más a fondo, si era para quedar bien, bien, si era en serio, puedes echarle un ojo a http://librosweb.es

[Neocim]

De verdad que lo siento. Todo iba bien con la web hasta que me he topado con este problema y os estoy pegando los trozos de código que creo que pueden ser útiles.

Lo de meterme más a fondo va muy enserio, pero ahora no puedo meterme tanto como para saber cómo solucionar este problema yo solo.
Como ya os he dicho,lo mio es más el mundo audiovisual y ahora mismo tengo demasiado trabajo (por suerte) y otros 3 programas en los que meterme a fondo,más que nada porque me darán de comer.

Gracias por el enlace que me has pasado,a favoritos de cabeza,y ahora me lo estoy mirando a ver si lo soluciono.

Si veis que no podéis ayudarme (por mi culpa,está claro) basta lo digáis,ya me buscaré la vida y cuando lo solucione os lo comento y seguro que hasta os reís xD

Lo dicho,gracias por la ayuda!

Pd:quedar bien es algo que me importa bastante poco,así que no iba por eso

[pzin]

Si no tienes subido el código a ningún hosting, puedes dejarlo en algún sitio como codepen.io, jsbin.com, o jsfiddle.net.

El caso es que con lo poco que enseñas, no se puede ver donde está el fallo, y el CSS no corresponde a la parte que afecta al problema. Por eso te decía de ponerlo en algún sitio y ya miramos a ver dónde está mal e intentamos explicarte el porqué.

Y nadie se va a reír de nada. Los fallos pequeños "tontos" están a la orden del día, desde el que hace su primer "hola mundo" hasta el que lleva años con estas historias.

[Neocim]

Bueno,os informo de que hoy (tras varias semanas trabajando en la web) un amigo ha venido a mi casa con un amigo suyo que sabe bastante de este tema, y hemos decidido darnos por vencido.

Hemos estado toda la tarde mirando las capas una a una, y seguimos sin entender porque la capa donde se encuentran los vídeos o fotos está limitada a un tamaño. Hemos hecho de todo,pero no hay forma.

Lo único que se nos ha ocurrido es que en lugar de tener todo en una sola página (la Index) y funcionar por capas, convertir cada capa en una página. Así que en principio empezaremos a trabajar en otra idea.

De todas formas muchas gracias por la ayuda

[pitufoweb]

Hola,

Lo mas fácil es que subas la web al hosting y nos pases la URL para verla.

Lo mas probable es que la columna del contenido principal tiene un overflow:hidden y/o tiene position:absolute.

Si subes la pagina a un hosting te aseguro que en menos de un minuto podremos saber cual es el problema.



Saludos

[pzin]

Suscribo el mensaje* de pitufoweb; pon el código en algún lugar y te decimos qué pasa.

Si te das por vencido y cambias el planteamiento por no entender una cosa, la próxima vez que ocurra te pasará lo mismo. No así si se encuentra el error y algún alma gentil te dé una explicación.

* Bueno, la firma no.

[Neocim]

Perdón,olvidé comentaros un plan B. Terminaré la web con estas "limitaciones",subiré menos fotos y vídeos, poniendo los respectivos enlaces a Vimeo y Flickr,para ver el resto de fotos.

La idea es tener la página web, y como dije ayer, empezar a meterme en este mundo de programación web. Así,cuando entienda mejor este tema, podré solucionar este y otros muchos errores de código que tengo.

De todas formas,espero que mi web pueda estar operativa esta semana, a más tardar la siguiente. Entonces os pasaré el enlace para que veais bien el error en este caso de los vídeos, de no poder solucionarlo quitaré ese tercer vídeo y listo.

Ahora mismo me interesa tener la web activa cuanto antes,ya que me están surgiendo varios proyectos.

Una vez más,muchas gracias, y espero en un par de días pasaros el link para que me deis vuestra opinión.

Un saludo