Comunidad PHPeros
Lenguajes => JavaScript => Mensaje iniciado por: AlejandroMMz en 24 de Junio de 2011, 02:51:01 am
-
Hola a tod@s, ¿que tal?
Estoy desarrollando un sitio web hace algún tiempo y va de maravilla, pero ahora si me he quedado estancado en una función que necesito crear, y me preguntaba si alguien sabe como, o donde puedo resolver o acercarme a la solución... les agradecería demasiado, ahora sí, de que se trata?
En cierta situación en la web, se produce el contenido de la página dividido en 2 divs, uno izquierdo y uno derecho, dentro de cada uno el contenido que le corresponde bla bla...
Sucede que en numerosas ocaciones el div izquierdo tomará una altura superior al derecho (del doble de altura en adelante. y queda bien, pero el div derecho quedará con un vacio blanco que baja de acuerdo a la altura del div izquierdo, no sé si me haga entender.. bueno aquí una imágen mejor...
(http://cubodi.com/php/1.png)
Bueno espero que hallan entendido la intención de la imágen, y de que todo está bien hasta ahí.. por ejemplo, si hay más o menos el mismo contenido en ambos DIVS pues conservarán una altura similar
El problema es cuando un DIV sobrepasa por mucha diferencia la altura del otro, en el caso real, el DIV IZQUIERDO el cual contiene el articulo, y al final muchos comentarios, hará que los divs se vean así:
(http://cubodi.com/php/2.png)
Ese espacio en blanco no es problema, pues allí habrá publicidad de Google Adsense (del tipo alargado) para rellenar un poco... el problema es que no siempre el articulo tendrá una cantidad suficiente de comentarios como para alargar el DIV lo suficiente y crear ese espacio blanco en el DIV derecho,
entonces necesito algo, ya sea con JS, PHP (no creo xd) o lo que sea, que pueda en cierto momento obtener la altura actual del DIV IZQUIERDO, y si este supera una altura especifica se muestre el contenido en el div derecho, (en este caso el anuncio)
PERO, si no supera determinada altura (es decir que no alargaria lo suficiente el div derecho) no muestre nada, porque si lo muestro siempre entonces sucederia que el div izquierdo ahora sería el alargado ....
ESPERO, que puedan ayudarme o guiarme por algún sentido para encontrar la respuesta acorde.
Muchisisimas gracias desde ahora,
saludos.
-
No te entendi muy bien pero creo que puedes hacerlo con un height:100%; y el clear:both; (según lo poco que entendi)
-
Nos dejas ver tu código? Creo que tengo tu solución :P
-
@Mixvice creo que entendiste acerca del auto height pero no es eso, eso ya lo tengo resuelto y prescisamente como lo has indicado con el clear, pero gracias igual. :)
@OmaarV sí claro porque no, espero que hallas entendido un poco lo que estaba preguntando...
<div id="page"> /* contiene ambos DIVS */
<div id="left">/*DIV IZQUIERDO (el cual tomará una altura de más del el doble que el derecho) */
<?
include 'inc/left.php'; /* contenido de ese DIV izquierdo (noticia y comentarios de dicha noticia) */
?>
</div>
<div id="right">/* DIV DERECHO */
<?
include 'inc/right.php'; /*contenido de ese DIV derecho (el contenido es casi igual de largo que el contenido de la izquierda, PERO cuando hay comentarios en el div de la derecha este queda vacio de ahí en adelante... */
?>
</div>
-
el codigo que falta y el CSS ? asi no podemos hacer mucho xD
-
jQuery ofrece el metodo .height() que devuelve un número con la altura en px de un elemento, con eso y un simple if que haga visible un elemento con la publicidad en función de una simple operación matemática está hecho... si no usas jQuery... la cosa se complica ligeramente
-
jQuery ofrece el metodo .height() que devuelve un número con la altura en px de un elemento, con eso y un simple if que haga visible un elemento con la publicidad en función de una simple operación matemática está hecho... si no usas jQuery... la cosa se complica ligeramente
¡Haaaaaaaas dado en el punto! estoy usando JQuery obviamente, para otras cosas de la web. y con .height() eh tratado pero aún no he podido, podrías ayudarme más o menos con ese código!? como comenzar el if o algo.. porque llevo 4 días en lo mismo. jaja.
saludos, gracias a todos. :)
-
jQuery ofrece el metodo .height() que devuelve un número con la altura en px de un elemento, con eso y un simple if que haga visible un elemento con la publicidad en función de una simple operación matemática está hecho... si no usas jQuery... la cosa se complica ligeramente
West, encuentro totalmente ilógico el uso de jQuery en este caso!.
Lo que debe de hacer es en el css, agregar la siguiente línea:
body, html{ height:100%; }
Y en el contenedor que quiere agrandar:
#nombreContenedor{ height:100%; }
-
Osea tu tienes en tu div izquierda un contenido que llega hasta aun punto, pero cuando llega a ese punto la div derecha se queda sin fondo por que se detuvo hasta donde llego su contenido, entonces tu quieres que la div derecha se extienda hasta donde llego la div izquierda (Osea fondo y borde o lo que sea) y se emparejen?
(http://img59.imageshack.us/img59/3391/hahahahak.png)
(Soy muy bueno en Paint a altas horas de la madrugada, es mi talento)
-
West, encuentro totalmente ilógico el uso de jQuery en este caso!.
Lo que debe de hacer es en el css, agregar la siguiente línea:
body, html{ height:100%; }
Y en el contenedor que quiere agrandar:
#nombreContenedor{ height:100%; }
En realidad es JQuery la única opción que veo, pero no se preocupen, seguramente ha sido mi intento de explicación lo que ha hecho que no entiendan mi problema...
lo que quiero es que se muestre un contenido en el div derecho SOLO SI (IF) el div izquierdo sobre pasa una altura X!
creo que ha quedado claro! disculpen mis rodeos pero no encontraba la forma de explicarlo bien....
-
West, encuentro totalmente ilógico el uso de jQuery en este caso!.
Lo que debe de hacer es en el css, agregar la siguiente línea:
body, html{ height:100%; }
Y en el contenedor que quiere agrandar:
#nombreContenedor{ height:100%; }
No es ese el punto me parece a mi, ya que quiere que algo se muestre o no en función de la longitud del otro elemento, eso lo alargaría siempre.
Lo que yo haría es algo así:
$(document).ready(function() {
if($('izquierdo').height() > $('derecho').height()+ALTODELOSANUNCIOS) {
$('anuncios').show();
}
});
Es muy sencillo, si el izquierdo es tan alto como el derecho con los anuncios, lo muestra...
-
No es ese el punto me parece a mi, ya que quiere que algo se muestre o no en función de la longitud del otro elemento, eso lo alargaría siempre.
Lo que yo haría es algo así:
$(document).ready(function() {
if($('izquierdo').height() > $('derecho').height()+ALTODELOSANUNCIOS) {
$('anuncios').show();
}
});
Es muy sencillo, si el izquierdo es tan alto como el derecho con los anuncios, lo muestra...
De eso estaba hablando, voy a adaptarlo a mi código y ya les avisaré como me fué.
Gracias a todos. :D k+