
Cambiar imagen de fondo segun ancho ventana
Publicado por Octavio (1 intervención) el 16/07/2011 03:19:36
Hola a todos.
Estoy con un sitio web y necesito poder al cargar la pagina, cambiar la imagen de fondo si el ancho de la ventana es menor a X valor.
La parte de obtener el ancho de la ventana mediante javascript ya la tengo lista, es la siguiente:
function alertSize() {
var myWidth = 0, myHeight = 0;
if( typeof( window.innerWidth ) == 'number' ) {
myWidth = window.innerWidth;
myHeight = window.innerHeight;
} else if( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) {
myWidth = document.documentElement.clientWidth;
myHeight = document.documentElement.clientHeight;
} else if( document.body && ( document.body.clientWidth || document.body.clientHeight ) ) {
myWidth = document.body.clientWidth;
myHeight = document.body.clientHeight;
}
if (myWidth<1000 || myHeight<500){
cambiarImagen();
}
//window.alert( 'Width = ' + myWidth );
//window.alert( 'Height = ' + myHeight );
}
lo unico que me falta hacer andar es la funcion cambiarImagen(), he intendado varias cosas y nada resulta.
Alguien me puede ayudar?
las lineas comentadas son 2 de las formas que intento cambiar la imagen
function cambiarImagen(){
//prueba1 document.gelElementById("miBody").setAttribute("background", "http://fullcine.tv/wp-content/uploads/apocalypse-now.jpeg");
//prueba2 this.style.background='url(imagenes/imagen2.gif)';
//prueba3 this.style.background='url(http://fullcine.tv/wp-content/uploads/apocalypse-now.jpeg)';
}
saludos y gracias a quien conste
Estoy con un sitio web y necesito poder al cargar la pagina, cambiar la imagen de fondo si el ancho de la ventana es menor a X valor.
La parte de obtener el ancho de la ventana mediante javascript ya la tengo lista, es la siguiente:
function alertSize() {
var myWidth = 0, myHeight = 0;
if( typeof( window.innerWidth ) == 'number' ) {
myWidth = window.innerWidth;
myHeight = window.innerHeight;
} else if( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) {
myWidth = document.documentElement.clientWidth;
myHeight = document.documentElement.clientHeight;
} else if( document.body && ( document.body.clientWidth || document.body.clientHeight ) ) {
myWidth = document.body.clientWidth;
myHeight = document.body.clientHeight;
}
if (myWidth<1000 || myHeight<500){
cambiarImagen();
}
//window.alert( 'Width = ' + myWidth );
//window.alert( 'Height = ' + myHeight );
}
lo unico que me falta hacer andar es la funcion cambiarImagen(), he intendado varias cosas y nada resulta.
Alguien me puede ayudar?
las lineas comentadas son 2 de las formas que intento cambiar la imagen
function cambiarImagen(){
//prueba1 document.gelElementById("miBody").setAttribute("background", "http://fullcine.tv/wp-content/uploads/apocalypse-now.jpeg");
//prueba2 this.style.background='url(imagenes/imagen2.gif)';
//prueba3 this.style.background='url(http://fullcine.tv/wp-content/uploads/apocalypse-now.jpeg)';
}
saludos y gracias a quien conste
Valora esta pregunta


0