Foros del Web » Creando para Internet » CSS »

Paginacion Responsive

Estas en el tema de Paginacion Responsive en el foro de CSS en Foros del Web. Estoy usando un plugin jquery (easyPaginate.JS) https://st3ph.github.io/jquery.easyPaginate/ para hacer una paginacion, donde solo quiero que se muestren 3 imagenes por pagina en la version desktop, ...
  #1 (permalink)  
Antiguo 26/05/2018, 16:45
 
Fecha de Ingreso: agosto-2005
Mensajes: 97
Antigüedad: 18 años, 10 meses
Puntos: 1
Paginacion Responsive

Estoy usando un plugin jquery (easyPaginate.JS)
https://st3ph.github.io/jquery.easyPaginate/


para hacer una paginacion, donde solo quiero que se muestren 3 imagenes por pagina en la version desktop, y una abajo de la otra segun adapto la pantalla....?, son como 20 imagenes con este codigo de muestra:

Código HTML:
Ver original
  1. <div id="easyPagination>
  2.  
  3.      <img class="imgpast" src="images/past_events/Kunsthanverkerne-  -Kongensgate.jpg"  alt="Kunsthanverkerne-i-Kongensgate" title="Kunsthanverkerne-i-Kongensgate">
  4. <p class="detaile">Desember 2017. Kunsthåndverkerne i Kongens gate</p>
  5. <hr>
  6.  
  7. </div>

El script es:


Código Javascript:
Ver original
  1. $("#easyPaginate").easyPaginate({
  2.         paginateElement: "img",
  3.         elementsPerPage: 3,
  4.         effect: "climb"
  5.     });

el CSS:

Código CSS:
Ver original
  1. #easyPaginate img {display:block;margin-bottom:10px;margin:auto;}
  2. .easyPaginateNav a {padding:5px;}
  3. .easyPaginateNav a.current {font-weight:bold;text-decoration:underline;}

Estoy usando un plugin jquery (easyPaginate.JS)
https://st3ph.github.io/jquery.easyPaginate/


para hacer una paginacion, donde solo quiero que se muestren 3 imagenes por pagina, son como 20 imagenes con este codigo de muestra:

Código HTML:
Ver original
  1. <div id="easyPagination>
  2.  
  3. <img class="imgpast" src="images/past_events/Kunsthanverkerne- -Kongensgate.jpg" alt="Kunsthanverkerne-i-Kongensgate" title="Kunsthanverkerne-i-Kongensgate">
  4. <p class="detaile">Desember 2017. Kunsthåndverkerne i Kongens gate</p>
  5. <hr>
  6.  
  7. </div>

El script es:


Código Javascript:
Ver original
  1. $("#easyPaginate").easyPaginate({
  2. paginateElement: "img",
  3. elementsPerPage: 3
  4.  
  5. });

el CSS:

Código CSS:
Ver original
  1. #easyPaginate img {display:block;margin-bottom:10px;margin:auto;}
  2. .easyPaginateNav a {padding:5px;}
  3. .easyPaginateNav a.current {font-weight:bold;text-decoration:underline;}

Como puedo hacer para que la paginacion sea responsiva??, de la forma que la hago y pruebo me funciona bien en desktop pero no en mobile...como podría arreglarlo..?

Gracias

Última edición por pzin; 29/05/2018 a las 23:48 Razón: Highlight código.

Etiquetas: responsive
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 08:11.