productos

css/especificos.css

@@ -550,6 +550,7 @@ a:hover,
 
 ul, li
 {
+    cursor: pointer;
     width: 200px;
     list-style-type: none;
     margin-bottom: 3px;
@@ -670,4 +671,4 @@ input#img-5:checked ~ .nav-dots label#img-dot-5,
 input#img-6:checked ~ .nav-dots label#img-dot-6 {
     background: rgba(0, 0, 0, 0.8);
 }
-********************/
+********************/

css/productos.css

@@ -18,7 +18,6 @@
 	float: left;
 }
 
-.pagina{ height: 470px; }
 
 #paginas_list
 {
@@ -52,8 +51,9 @@ margin-top: 50px;
 }
 
 /*************LISTA PRODUCTOS************/
-.producto {width: 50%;float:left;}
-
+.producto {width: 32%;float:left;}
+.producto2 { width: 49%; }
+.producto1 { width: 99%; }
 #productosbar
 {
 	float: left;
@@ -95,23 +95,22 @@ margin-top: 50px;
 	display: table;
 }
 
-.listaproductos{padding-bottom:10px; width:100%;min-height:250px;}
+.listaproductos{padding-bottom:10px; width:100%;min-height:370px;padding-left:15px;}
 .imagen{
-	margin-top: 2%;
-	margin-left: 2%;
-	display: inline-block;
+	display: block;
 	text-align: center;
 	width: 25%;
-	float: left;
+    margin:0px auto;
+
 }
 
 .texto{ 
 	font-family: 'Open Sans';
 	color: #465A68;
-	display: inline-block; 
-	width: 70%; 
-	float:left;
+	display: block; 
+	width: 85%; 
 	font-size: 14px;
+    margin: 0px auto;
 }
 #texto{
 	font-family:'Open Sans';
@@ -141,4 +140,7 @@ margin-top: 50px;
 }
 
 #flechafwd{z-index:2; top: 40%; position:absolute; right:10px;}
-#flechaatras{z-index: 2; top: 40%; position: absolute; left: 250px;}
+#flechaatras{z-index: 2; top: 40%; position: absolute; left: 250px;}
+
+.vermas { display: inline; margin: 0px; font-weight: bold; }
+#pagina-1 { display: none; }

listaprod.php

@@ -21,22 +21,26 @@ $pag=0;
 if ($count > 4) echo "<div id='flechaatras'><img src='Images/left.png'></div>";
 while ( $statement->fetch() ) {
     $i++;
-    if (($i-1) % 4 == 0  && $i > 1 || $i == 1) {
+    if (($i-1) % 6 == 0  && $i > 1 || $i == 1) {
         echo "<div class='pagina' id='pagina-$pag'>\n";
         $pag++;
     }
-	if(($i-1) % 2 == 0){ echo "<div class='listaproductos'>\n"; }
-	$html ="<div class='producto'>
+	if(($i-1) % 3 == 0){ echo "<div class='listaproductos'>\n"; }
+    $class="producto";
+    if ($count < 3) #clase producto1 o producto2 para css custom
+        $class="producto producto$count";
+
+	$html ="<div class='$class'>
                 <div class='imagen'>
                     <img src='Images/producto.jpg'>
                 </div>
                 <div class='texto'>
-                    <h5>$nombre</h5><br>$desc<br><br><u prodid='$id' style='cursor:pointer;'>Ver más</u>
+                    <h5>$nombre</h5><br>$desc<p class='vermas' prodid='$id' style='cursor:pointer;'> [+]</p>
                 </div>
            </div>";
     echo $html;
-	if($i % 2 == 0) { echo "</div>"; } # listaproductos
-    if($i % 4 == 0) { echo "</div><div id='flechafwd'><img src='Images/right.png'></div>"; } #pagina
+	if($i % 3 == 0) { echo "</div>"; } # listaproductos
+    if($i % 6 == 0) { echo "</div><div id='flechafwd'><img src='Images/right.png'></div>"; } #pagina
 	
 }
 /*if ($count > 4) echo "<div id='flechafwd'><img src='Images/right.png'></div>";*/

productos.php

@@ -24,7 +24,7 @@ $(document).ready(function() {
 	function getData() {
 	$.get('listaprod.php', { cat : cat }).done(function(data) {
 		$("#paginas_wrapper").html(data);
-		$(".texto u").click(function(){
+		$(".texto p").click(function(){
 			expand = $(this).attr('prodid');
 			getDesc();
 		});