Foros del Web - Ver Mensaje Individual

IsaBelM · #9 (**permalink**) 31/10/2011, 07:02

yo en lugar de jquery, uso js + asp. en este caso he intentado traspolar el asp a php. como verás sólo detecta ie8 (por que mis conocimientos de php son muy limitado. y tener que usar matrices ...) pero como ejemplo ilustrativo creo que se entenderá.

con php se detecta el navegador y su versión. en caso que sea ie8 (que no soporta media queries) invoca la función. en la función se detecta el ancho de pantalla y se cambia el atributo media a all (que si es soportado por ie8-)

Cita:

<!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 content="text/html; http-equiv="Content-Type" charset=utf-8"/>
<title></title>
<link href="./style.css" rel="stylesheet" type="text/css" media="only screen and (max-width: 1280px)"/>
<script type="text/javascript">
function fnc() {
if (screen.width <= 1280) {
var diana = document.getElementsByTagName('link')[0];
diana.media = 'all';
}
}
</script>
</head>
<body>

<div class="caja">
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.ipsum dolor sit amet, consectetuer adipiscing elit,
</div>

<?php
$pajar = $_SERVER['HTTP_USER_AGENT'];
$aguja = 'MSIE 8.0';
$busqueda = strpos($pajar, $aguja);
if ($busqueda !== false) {
?>
<script type="text/javascript">
fnc();
</script>
<?php
}
?>
</body>
</html>

el css de caja algo sencillo

Cita:

.caja {
background: yellow;
width: 500px;
height: auto;
margin: 0 auto;
}