Resolucion de pantalla en head para añadir a variable php

He buscado muchos hilos pero ninguno me ha funcionado y lo que estoy haciendo en mi web es....


Obtener la URl con PHP


If ($url = "www.pepito.com") {
$ruta = "-----rutadelaimagen.jpg";
}




La cosa es que me gustaria saber como puedo hacer para obtener la resolucion de pantalla del usuario ya que segun la resolucion de la misma le cargaria una imagen con su resolucion; me gustaria obtener lo siguiente:


If ($url = "www.pepito.com") {
$ruta = "-----rutadelaimagen1024x768.jpg";
}




He intentando con Javascript de muchas formas pero no hay forma de sacarlo, agradeceria que me ayudarais a lograrlo.


Muchas gracias y un saludo.
Ok Yanet eso ya lo habia encontrado, la cosa es ahora como asignar eso a una variable en php para poder usarla y concatenarla despues con los ifs para la imagen que corresponda con la resolucion.

Saludos y gracias.
bien
encontré esto otro.....

<script language="javascript">
var ancho = screen.width;
var alto = screen.height;

</script>
<?
$ancho = "<script>document.write(ancho)</script>";
$alto = "<script>document.write(alto)</script>";
echo "el ancho de pantalla es ".$ancho;
echo "</br>la altura de pantalla es ".$alto;
if ($ancho = 1366)
echo "</br>panntalla grande";
else "</br>pantalla chica";
?>

miralo aqui
http://ayudando.comocreartuweb.es/ayuda.php

y lo encontré aqui, aunque por los comentarios dudo que te sirva
http://foro.elhacker.net/php/pasando_variables_de_javascript_a_php-…

y mir
Ok, eso es exactamente lo que necesitaba, pero la variable ancho lleva esto: <script>document.write(alto)</script>990 (por ejemplo); como hago ahora con PHP para eliminar lo de <script...... y guardarme SOLO el valor de la altura?

Digo esto porque he probado con substring para eliminar lo de script pero entonces me pierde el valor de la altura.

Muchas gracias.

Saludos.
mmm ahi si ni idea...
porque como dices, al eliminarlo pues ya no recojes los valores de java...
Os comento, yo por ahora tengo esto en una variable:


$total = "http://www.jonathandiazm.com/wp-content/themes/naturefox/images/blog";


que es la URL de la imagen que quiero mostrar, despues he colocado lo siguiente con el objetivo de obtener el ancho y alto de la pantalla:


<script type="text/javascript">
var width = screen.width;
var height = screen.height;
document.cookie ='width='+width';
document.cookie ='height='+height';
</script>
<img id="background" src="<?php 
$width =  $_COOKIE["width"];
$height =  $_COOKIE["height"];
$total = $total . $width ."x" .$height .".jpg";
echo $total; ?>" alt="" title="" /> 
</div>


Como podeis ver, el objetivo es que acabe colocando la URL asi:


http://www.jonathandiazm.com/wp-content/themes/naturefox/images/blog1024x768.jpg


para que muestre el fondo que le corresponde.


La cuestion es que no se porque pero no funciona bien y no obtengo el ancho ni el alto.


¿Alguna ayuda para solucionarlo ya que casi lo tengo?


Muchas gracias y un saludo.
Bueno victor, pides algo dificil si lo quieres bien cocinado, pero recien vi que no tenias resuelta tu duda y fui a cocinar una funcion que te permitira hacer lo que quieres, recuerda que aun soy nuevo y quiero aportar mucho a esta comunidad(tarde en resolver el problema porque tenia un rato que no programaba, y otro mas que no lo hacia en javascript, digamos que alrededor de 1 año jeje, igual que php, pero perfeccione mas php que javascript supongo que no te interesa pero bueno entonces empezemos.

Solo necesitaras 2 archivos uno resolucion.html y otro comprueba.php

resolucion.html :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript">
 /*
^                  SurKaiser  
^     Funcion, llama imagen de resolucion de pantalla
*
^        http://www.comocreartuweb.com
*
*
*/
  var ancho = screen.width;
  var alto  = screen.height;
  //Atencion si vas a usar imagen externa, omite el ajax
  //Le restara funciones, pero recomiendo que las imagenes que cargues
  //Existan en tu sitio.
  //Por eso en url debes ingresar la direccion (sin usar http://) de tu imagen
  var url   = "imagenes/blog";
 //Aqui al final pon la extension de tus imagenes (supongo que son .jpeg o .jpg)
 //Yo no tenia otra imagen disponible a la mano y use una .png al programarla
 //No es necesaria la extension .png xD
  var nuevaUrl = url + ancho + "x" + alto +".png";
  //Ahora necesitamos comprobar que la imagen de su resolucion exista
  //Asi que tendremos que llamar a php para que compruebe algunas cosillas
  //Para eso usaremos un poco de ajax =)
  function obtenerXMLHTTP()
  {
     try{
	 obtener = new XMLHttpRequest();
	 } catch(err1) { 
	   try {
	   obtener = new ActiveXObject("Microsoft.XMLHTTP");
	   }
	  catch(err2) {
	   try {
	   obtener = new ActiveXObject("Microsoft.msxml2");
	   }
	  catch(err3) {
	  obtener = false;
	  }
	 }
	}
	 return obtener;
	}
	ajax = new obtenerXMLHTTP();
	function archivoExiste()
	{
	  var archivo = "comprueba.php?url="+ nuevaUrl;
	  ajax.open('GET',archivo, true);
	  ajax.onreadystatechange = respuesta;
	  ajax.send(null);
	  }
	  function respuesta()
	  {
	     if(ajax.readyState == 4)
		 {
		   if(ajax.status == 200)
		   {
            var miImagen = document.getElementById("imagen");
             miImagen.src = ajax.responseText;
			 //En caso de que carge la imagen por default, aseguremonos ajustandola
			 miImagen.widht = ancho;
			 miImagen.height= alto;
		   }
		 }

  }
  
  </script>
<title>Cambia Imagen A resolucion By SurKaiser</title>
</head>

<body onload="archivoExiste();">

<img src="" id="imagen" />
</body>
</html>

comprueba.php :

<?php
/*
^                   SurKaiser  
^     Funcion, llama imagen de resolucion de pantalla
*
^        http://www.comocreartuweb.com
*
*
*/
$url = $_GET['url'];

  if(file_exists($url))
  {
        //Si el archivo existe le mostramos la url del archivo
     echo $url;
	 }
	 else {
	 //Si el archivo de su resolucion no existe
	 //Mostramos una imagen por default, que automaticamente
	 //Sera ajustada al tamaño de su resolucion
	 //Recomiendo una de un tamaño grande
	 //por si se modifica no se deforme
	 //Tambien tener imagenes de las resoluciones mas comunes
	 //Como 800x600 , 1280x1024 etc.
	 $url = "http://localhost/root/imagenes/default.jpg";
	 echo $url;
	 }
	 
	 ?>

cualquier duda solo responde igual si te sirvio =)

Saludos !!
Bueno veo que despues de todo ignoraste mi code , pero bueno tienes un error en el html olvidaste cerrar la etiqueta img ">" saludos
No hes que la ignorara, solo que al final logre encontrar el fallo, pero tendre que usar el tuyo porque a mi no me funciona ahora correctamente. Gracias por el codigo que faltaba.

Saludos.
victor5atodogas escribió:Ok, eso es exactamente lo que necesitaba, pero la variable ancho lleva esto: <script>document.write(alto)</script>990 (por ejemplo); como hago ahora con PHP para eliminar lo de <script...... y guardarme SOLO el valor de la altura?

Digo esto porque he probado con substring para eliminar lo de script pero entonces me pierde el valor de la altura.

Muchas gracias.

Saludos.

$ancho=str_replace("<","",$ancho);
$ancho=str_replace(">","",$ancho);
$ancho=str_replace("/","",$ancho);
$ancho = ereg_replace("[ a-zA-Z]","",$ancho);

y te quedan solo los numeros
Pues yo ya lo resolvi .... es cuestion que victor decida que hacer ..... no recomiendo mucho usar cookies por lo menos no usando wordpress , y menos con javascript .. y menos combinarlo de tal manera con php ... abres muchos oyos de seguridad y se vuelve mas vulnerable.

Saludos
Bueno, al final he optado por colocar tu codigo como puedes ver aqui:

http://www.jonathandiazm.com/galerias/nueva

L
a cosa es que aqui: var url = "imagenes/blog";

me gustaria que colocara el valor de $total que lleva en php (es la ruta con http:// en la que llevo la URL de la imagen y que depende de la pagina en la que estamos; luego otra cosa que me gustaria es saber como puedo hacer ya que tengo estas resolucion (por ejemplo suponte que tengo varias fotos con ese tamaño para cada pagina):


800x600
1024x768
1440x960'


La cosa seria como hacer con el codigo que si abre la pagina una persona con una 1124 le cargue la imagen de resolucion inmediatamente superior.


Gracias por todo, creo que al final lo resolvere!jejejej


PD: Por si lo sabes, necesito saber como puedo hacer que un div sufra un retraso de digamos 5 segundos mediante el cual aparecer un .gif de "Cargando", y una vez pasan esos 5 segundos va apareciendo el div poco a poco.
Claro es muy facil tu duda ...

1.- es simple dejalo de esta forma:

var url = "<?=$tuvariablephp?>"; y listo .

En cuanto a la imagen , si te das cuenta en el archivo php que te deje adjunto, hay un "else" en el que tambien comento, y te menciono que si la resolucion del usuario que entre a nuestro sitio, no existe una imagen de tal resolucion, le asigne una imagen por default, y esta se ajustara al tamaño del usuario, (puedes leer los comentarios del archivo php y lo notaras).

En cuanto al div .... quieres poner una imagen gif que diga cargando y mostrar div con su contenido poco a poco??? ...

Si es asi , hay una forma pero es manejando muy bien el arbol de nodos (DOM) ... utilizando atributos como attr, childnodes, entre otros que manejan el arbol de nodos y serviria para ir creando los elementos o contenido del div poco a poco... si conoces como usar estos manejadores del DOM , lo harias muy facil, la otra idea que se me ocurre es usando AJAX ... en el archivo .php dejamos el div ... y un retraso de etiquetas cada segundo ... asi la respuesta del ajax seria lo que le muestre php y este le mostraria parte de codigo cada segundo , se puede hacer con la funcion sleep(segundos); con php .... aunque no estoy seguro si esto ultimo funcionaria.
Vayamos por partes, creo que ya esta solucionado, pero lo de que cargue una imagen me gustaría lo siguiente....
yo tengo como decía una variable $a que lleva esto http://www.jonathandiazm.com//wp-content/themes/naturefox/images/galerias

M
ediante el código añade lo de anchura por altura .jpg y coloca esta imagen (en mi caso); http://www.jonathandiazm.com//wp-content/themes/naturefox/images/galerias1440x900.jpg
q
ue existe; pero me gustaría que cuando NO existiera la imagen, colocara $a + 1024x768.jpg.....hay que tener en cuenta que no le puedo poner un valor fijo ya que en cada sección o pagina hay un fondo diferente, por lo que debería poder recoger $a en comprobar.php.

Por otro lado me gustaría saber si es posible que muestre la imagen mas rápidamente:

http://www.jonathandiazm.com/galerias

y
a que le cuesta un poco mostrarla

Respecto a lo ultimo, lo del retardo, lo del DOM no tengo ni idea, así que supongo que seria con ajax y lo que pretendo es algo tipo la pagina del autor de la foto si buscas esto en google:
"mejor fotografo del mundo de naturaleza", como veras ahí se muestra la imagen de fondo y va apareciendo el contenedor, me gustaría algo tipo así para que se viera la imagen de fondo.

Saludos.
Por cierto, si coloco este codigo en comprueba no me funciona lo de la imagen:

<?php$url = $_GET['url'];
$total = $_GET['total'];


  if(file_exists($url))
  {
     echo $url;
     }
     else {
     $url = $total ."1024x768.jpg";
     echo $url;
     }
     
 ?>

Pero si quito lo del if, etc si que funciona, creo que el if iria mejor en el script, ya que yo se que resoluciones tienen que existir y cuales no y asi no nos matamos tanto, si tenemos que hacerlo en comprobar.php habria que colocar la variable aqui:

var archivo = "http://www.jonathandiazm.com/comprueba.php?url="+ nuevaUrl;

la cosa es que deberia ser algo tipo asi:

var archivo = "http://www.jonathandiazm.com/comprueba.php?url="+ nuevaUrl +"total="+ total;

pero no se si esto lo hara bien.

Saludos.
Hola,

Entonce lo que quieres hacer es que si no existe la imagen de resolucion que ponga una por default, efectivamente me habia adelantado a esa parte, por el comprueba.php , pero en el codigo que te di te comentaba que no funcionaria lo de comprobar si ponias http, ya que file_exists es para el servidor de manera interna, y con http lo tomaria como externo y entonces se anula la funcion, es por eso que yo solo puse en la variable url la direccion interna de las imagenes "imagenes/blog" , de igual forma podria crear una funcion para comprobar url de manera externa usando la libreria 'curl' de php , pero debes tenerla activa, si por el contrario no la tienes activada intenta, ingresar directorios sin necesidad del http, ¿Y? la variable total para que seria?? .... bueno en fin ¿Esta era tu duda? .... es por si entendi mal la duda si es asi pues ya la respondi en caso de que no puedas quitar los http ... podria hacer la funcion curl.

Saludos
Prefiero hacerlo con http ya que sino tendria que cambiar muchas cosas asi que estaria bien usar la funcion curl; la variable total es en la que llevo la URL de la imagen sin el ancho, alto ni .jpg; me gustaria que al comprobar en el servidor si la imagen existe la coloque pero si no existe, que coloque la imagen 800x600 respecto a esa pagina (hay que tener en cuenta que no se puede poner una foto predefinida ya que en cada pagina cambia, por lo que habria que enviar la variable total a la otra pagina (comprueba.php) para que si no existe (querra decir que no hay foto para esa resolucion en esa pagina en concreto) coloque la 800x600 por ejemplo.

Recuerda que tambien es importante saber porque se retrasa en cargar o "Mostrar" la imagen de fondo, y saber como hacer el efecto de "retardo" al mostrar un div y aparezca poco a poco para que se vea la imagen de fondo mejor.

Saludos y gracias por todo.
Muy bien entonces a usar libreria curl!.

Ahora he mejorado la funcion cambia imagen a resolucion de pantalla del usuario

version 2.0 by SurKaiser :

- Mejora notable en la seguridad :
*Se añadio base64_encode();
*Se añadio utf8_encode();
* Comprobacion de variables $_GET;
* Cerrados oyos de seguridad, ahora es mas seguro usarlo dentro de CMS.
- Funcion usar 'http://' o simplemente direccion del fichero:
*Se implemento funcion curl(); para el uso de http
*Se habilito opcion para usar http o solo fichero.
- Fixs/bugs reparados :
*Carga de imagen 50% mas rapida.
*Ahora es funcionable la carga de imagenes por default

Bueno esta funcion puede servirles a mas de uno es por eso que tambien la mejore de esta forma .

Necesitamos 2 archivos resolucion.html y comprueba.php
Para que funcione se deben editar :
en el archivo resolucion.html
solo 2 variables , la variable url es la que contendra la direccion con las imagenes y la variable usarHttp='' a true si utilizaremos http recuerda tener activada la libreria curl en tu servidor esto tambien habilitara imagenes externas , quiere decir que pueden ser de tu propio servidor o uno externo, a false en el caso de no contar con la libreria curl o en el caso de querer solo usar imagenes internas si lo dejas en false recuerda que en url no podras ingresar 'http://'
En el archivo comprueba.php editar las variables $url y $url en las lineas 42 y 68, estas estan vacias, aqui ingresaras la url de la imagen a mostrar en caso de que no exista la del usuario visitante.
Esto es todo aqui el codigo fuente :

resolucion.html :
                  <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript">
 /*
^                  SurKaiser  
^     Funcion, llama imagen de resolucion de pantalla
*              Version 2.0
^        http://www.comocreartuweb.com
*
*
*/
  var ancho = screen.width;
  var alto  = screen.height;
  //Recuerda si usaras http:// , debes tener activada la funcion curl(); en php
  //En caso contrario ingresa direccion interna del servidor (sin http://) y 
  //Modificas la variable usarHttp = 'true' a usarHttp = 'false';
  var url   = "DIRECCION DE LAS IMAGENES";
   // ¿Usaremos http?
  //Si usaremos http:// entonces usarHttp = 'true' si no usaremos http, entonces usarHttp='false'
  var usarHttp = '';
  //Extension de la imagen a usar, cambia la extension de imagen por la que desees usar(por defecto .jpg)
  var extension = ".jpg";
    //Necesitamos mas seguridad xD
 
var Base64 = {
 

	_llaveStr : "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=",
 
	
	encryptar : function (entrada) {
		var salida = "";
		var chr1, chr2, chr3, enc1, enc2, enc3, enc4;
		var i = 0;
 
		entrada = Base64._utf8_encryptar(entrada);
 
		while (i < entrada.length) {
 
			chr1 = entrada.charCodeAt(i++);
			chr2 = entrada.charCodeAt(i++);
			chr3 = entrada.charCodeAt(i++);
 
			enc1 = chr1 >> 2;
			enc2 = ((chr1 & 3) << 4) | (chr2 >> 4);
			enc3 = ((chr2 & 15) << 2) | (chr3 >> 6);
			enc4 = chr3 & 63;
 
			if (isNaN(chr2)) {
				enc3 = enc4 = 64;
			} else if (isNaN(chr3)) {
				enc4 = 64;
			}
 
			salida = salida +
			this._llaveStr.charAt(enc1) + this._llaveStr.charAt(enc2) +
			this._llaveStr.charAt(enc3) + this._llaveStr.charAt(enc4);
 
		}
 
		return salida;
	},
	
	_utf8_encryptar : function (string) {
		string = string.replace(/\r\n/g,"\n");
		var utftext = "";
 
		for (var n = 0; n < string.length; n++) {
 
			var c = string.charCodeAt(n);
 
			if (c < 128) {
				utftext += String.fromCharCode(c);
			}
			else if((c > 127) && (c < 2048)) {
				utftext += String.fromCharCode((c >> 6) | 192);
				utftext += String.fromCharCode((c & 63) | 128);
			}
			else {
				utftext += String.fromCharCode((c >> 12) | 224);
				utftext += String.fromCharCode(((c >> 6) & 63) | 128);
				utftext += String.fromCharCode((c & 63) | 128);
			}
 
		}
 
		return utftext;
	}
};  
    var nuevaUrl = url + ancho + "x" + alto + extension;
   
	usarHttp = Base64.encryptar(usarHttp);

    nuevaUrl = Base64.encryptar(nuevaUrl);
  //Ahora necesitamos comprobar que la imagen de su resolucion exista
  //Asi que tendremos que llamar a php para que compruebe algunas cosillas
  //Para eso usaremos un poco de ajax =)
  
  function obtenerXMLHTTP()
  {
     try{
	 obtener = new XMLHttpRequest();
	 } catch(err1) { 
	   try {
	   obtener = new ActiveXObject("Microsoft.XMLHTTP");
	   }
	  catch(err2) {
	   try {
	   obtener = new ActiveXObject("Microsoft.msxml2");
	   }
	  catch(err3) {
	  obtener = false;
	  }
	 }
	}
	 return obtener;
	}
	ajax = new obtenerXMLHTTP();
	function archivoExiste()
	{
	  var archivo = "comprueba.php?usar=" + usarHttp + "&url="+ nuevaUrl;
	  ajax.open('GET',archivo, true);
	  ajax.onreadystatechange = respuesta;
	  ajax.send(null);
	  }
	  function respuesta()
	  {
	     if(ajax.readyState == 4)
		 {
		   if(ajax.status == 200)
		   {
            var miImagen = document.getElementById("imagen");
             miImagen.src = ajax.responseText;
			 //En caso de que carge la imagen por default, aseguremonos ajustandola
			 miImagen.widht = ancho;
			 miImagen.height= alto;
		   }
		 }

  }
  
  archivoExiste();
  
  </script>
<title>Cambia Imagen A resolucion By SurKaiser</title>
</head>

<body>

<img src="" id="imagen" />
</body>
</html>

comprueba.php :
 <?php
/*
^                   SurKaiser  
^     Funcion, llama imagen de resolucion de pantalla
*                Version 2.0
^        http://www.comocreartuweb.com
*
*
*/
   //Seguridad xD
   $http = $_GET['usar'];
   $http = htmlspecialchars($http);
   $http = htmlspecialchars($http, ENT_QUOTES);
   $http = base64_decode($http);
   $http = utf8_decode($http);
   //Repetimos con la url xD
$url = $_GET['url'];
 $url = htmlspecialchars($url);
 $url = htmlspecialchars($url, ENT_QUOTES);
$url = base64_decode($url);
$url = utf8_decode($url);
     if($http == '')
	 {
          }
		  else if($http == 'true')
		  {
		  //Si usaremos http, entonces usaremos curl
		  //Recuerda tenerla activada en php
	 $fp = curl_init($url);
$abrir = curl_setopt($fp, CURLOPT_RETURNTRANSFER, 1);
$abrir = curl_setopt($fp, CURLOPT_TIMEOUT, 30);
$abir = curl_exec($fp);
$info = curl_getinfo($fp, CURLINFO_HTTP_CODE);
curl_close($fp);
  switch($url)
  {
    case '' :
	break;
	default:
if($info == 404){
   //No existe la imagen , entonces mostraremos la imagen por default, o la que quieras mostrar
   $url= "";
    echo $url;
	exit;
}else{
   //Existio la imagen mostremosla xD
    echo $url;
	exit;
}  
   break;
   }
   } else if($http == 'false')
   {
     //Si no usaremos http:// , entonces comprobemos si existe en el servidor
    if(file_exists($url))
  {
        //Si el archivo existe le mostramos la url del archivo
     echo $url;
	 }
	 else {
	 //Si el archivo de su resolucion no existe
	 //Mostramos una imagen por default, que automaticamente
	 //Sera ajustada al tamaño de su resolucion
	 //Recomiendo una de un tamaño grande
	 //por si se modifica no se deforme
	 //Tambien tener imagenes de las resoluciones mas comunes
	 //Como 800x600 , 1280x1024 etc.
	 $url = "";
	 echo $url;
	 }
	} else {
	 echo "&nbsp;";
	 }
	 ?>
        
Saludos! [;)]
Ok muchas gracias, creo que funcionara, luego lo probare y te comentare.

Si supieras lo del efecto este de retardo tambien me vendria genial.

Saludos.