MAPA Mejoras en la visualizacion especialmente apra dispositivos móviles

This commit is contained in:
humano 2015-11-03 11:18:30 -05:00
parent 619bb3aed8
commit 7a5f3e6236
2 changed files with 50 additions and 35 deletions

View File

@ -112,14 +112,14 @@ function mapa_ficha($id) {
$resultado =" $resultado ="
<div style='border-radius:10px ; <div style='border-radius:10px ;
vertical-align: top;
background-color:white ; background-color:white ;
right:5px ; right:5px ;
/*z-index:10000 ;*/
position:absolute ; position:absolute ;
top:5px; top:5px;
padding:5px ;' padding:5px ;'
class='panel-map' id='panel_map_$id' > class='panel-map' id='panel_map_$id' >
<A href='#' onclick=\"xajax_limpia_div('panel_map_$id'); \"><span class='pull-right'><i class='fa fa-times'></i></span></A>
<div role='row' class='row center-block' > <div role='row' class='row center-block' >
<div class='col-xs-4 col-md-12'> <div class='col-xs-4 col-md-12'>
$imagen $imagen
@ -134,6 +134,7 @@ function mapa_ficha($id) {
<A target='milfs' HREF='https://github.com/humano/milfs'><small class='pull-right'>MILFS</small></A> <A target='milfs' HREF='https://github.com/humano/milfs'><small class='pull-right'>MILFS</small></A>
</div> </div>
</div> </div>
</div>
"; ";
return $resultado; return $resultado;
} }
@ -223,7 +224,7 @@ $consulta = "
$sql=mysql_query($consulta,$link); $sql=mysql_query($consulta,$link);
if (mysql_num_rows($sql)!='0'){ if (mysql_num_rows($sql)!='0'){
$resultado = "<ul class='list-inline'>"; $resultado = "<div class='' style='vertical-align: top; text-align:center;'>";
while( $row = mysql_fetch_array( $sql ) ) { while( $row = mysql_fetch_array( $sql ) ) {
$icono = remplacetas('form_parametrizacion','campo',$perfil,'descripcion'," tabla='form_id' and opcion = 'categoria:icon:$row[md5_contenido]'") ; $icono = remplacetas('form_parametrizacion','campo',$perfil,'descripcion'," tabla='form_id' and opcion = 'categoria:icon:$row[md5_contenido]'") ;
@ -234,10 +235,10 @@ while( $row = mysql_fetch_array( $sql ) ) {
$icon = $icono[0]; $icon = $icono[0];
} }
$icono = "$icon"; $icono = "$icon";
$contenido= substr($row[contenido],0, $length = 100); $contenido= substr($row[contenido],0, $length = 15);
$resultado .= "<li class ='' style='' title='$row[contenido]'><div style='max-width:60px;'><img class='img img-rounded img-responsive' src='$icono' style='max-height:50px;'><small>$contenido</small></div></li>"; $resultado .= "<div class='' style='width:50px; heigth:100px; float:left; vertical-align: top; margin: 5px; text-align:center'><img style=' height:50px;' class='' src='$icono' style=''><small>$contenido</small></div>";
} }
$resultado .= " </ul >"; $resultado .= " </div >";
} }
else{$resultado = '';} else{$resultado = '';}
} }

View File

@ -23,7 +23,6 @@ $plantilla ="mapa";
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content=""> <meta name="description" content="">
<meta name="author" content="fredyrivera" >
<?php $xajax->printJavascript("xajax/"); ?> <?php $xajax->printJavascript("xajax/"); ?>
<link rel="shortcut icon" href="favicon-152.png"> <link rel="shortcut icon" href="favicon-152.png">
<link rel="apple-touch-icon-precomposed" href="favicon-152.png"> <link rel="apple-touch-icon-precomposed" href="favicon-152.png">
@ -44,15 +43,14 @@ $plantilla ="mapa";
background:rgba(255,255,255,1) ; background:rgba(255,255,255,1) ;
} }
@media (min-width: 800px) { @media (max-width: 800px) {
.panel-map{ .panel-map{
max-width: 970px; max-width: 970px;
} }
.listado_categorias{
max-height: 70px;
}
} }
@media (min-width: 1200px) { @media (min-width: 800px) {
.panel-map{ .panel-map{
max-width: 200px; max-width: 200px;
} }
@ -73,14 +71,7 @@ body {
margin-bottom: 60px; margin-bottom: 60px;
padding: 0; margin: 0; padding: 0; margin: 0;
} }
.footer {
position: absolute;
bottom: 2px;
width: auto;
/* Set the fixed height of the footer here */
height: auto;
z-index:5000
}
/* Custom page CSS /* Custom page CSS
@ -94,11 +85,29 @@ body > .container {
margin: 20px 0; margin: 20px 0;
} }
.footer {
position: absolute;
bottom: 3px;
width: 95%;
margin: 0 auto;
height: 120px;
/* Set the fixed height of the footer here */
z-index: 999999;
}
.footer > .container { .footer > .container {
padding: 2px; padding: 2px;
background-color: white; background-color: white;
border-radius: 3px; border-radius: 3px;
width: auto; width: 90%;
height: 120px;
overflow-x: scroll;
} }
code { code {
@ -121,7 +130,11 @@ code {
<body> <body>
<div id='map'> <div id='map'>
<div class='footer' ><div style=" " class='container'><?php echo $categorias = lista_categorias($_REQUEST[id],'','') ; ?></div></div> <div class='footer' id='contenedor_pie' >
<div style=" " class='container' >
<a href="#" onclick="xajax_limpia_div('contenedor_pie'); "><span class='pull-right'><i class='fa fa-times'></i></span></a>
<?php echo $categorias = lista_categorias($_REQUEST[id],'','') ; ?>
</div></div>
</div> </div>
<script> <script>
@ -158,6 +171,7 @@ myLayer.setGeoJSON(geoJson);
<?php echo mapa_ficha("$_REQUEST[id]");?> <?php echo mapa_ficha("$_REQUEST[id]");?>
<!-- Modal --> <!-- Modal -->
<div class='modal fade ' id='muestraInfo' tabindex='-1' role='dialog' aria-labelledby='myModalLabel' aria-hidden='true'> <div class='modal fade ' id='muestraInfo' tabindex='-1' role='dialog' aria-labelledby='myModalLabel' aria-hidden='true'>