Tema: Scroll horizontal con jquery
Ver Mensaje Individual
  #2 (permalink)  
Antiguo 24/10/2011, 15:46
zubintro
 
Fecha de Ingreso: septiembre-2007
Mensajes: 120
Antigüedad: 17 años, 2 meses
Puntos: 0
Respuesta: Scroll horizontal con jquery
Para los que visitaron el tema y quedaron con la duda les presento la solucion que encontre aprovechando de usar una una libreria de Jquery de flowplayer.org que esta disponible para cualquier persona y haciendo unos ajustes en el php, el codigo quedaria asi y funciona perfectamente:

Código PHP: 
Ver original
  1. <script src="http://cdn.jquerytools.org/1.2.6/full/jquery.tools.min.js"></script>
  2. <!-- standalone page styling (can be removed) -->
  3.     <link rel="stylesheet" type="text/css" href="http://static.flowplayer.org/tools/css/standalone.css"/>   
  4.  
  5. <style id='flashfirebugstyle' type='text/css'>object,embed{visibility:hidden !important;}</style><script type='text/javascript'>window.addEventListener('load', function() {document.addEventListener('DOMNodeInserted', function(e) {if(e.target.tagName.toLowerCase() == 'object' || e.target.tagName.toLowerCase() == 'embed'){try{FlashFirebug_init();}catch(e){}}}, false);try{FlashFirebug_init();}catch(e){}},false);</script></head>
  6.  
  7. <body>
  8.  
  9. <link rel="stylesheet" type="text/css" href="http://mexmedia.colmex.mx/tezcatl/themes/default/css/nuevoscroll/scrollable-horizontal.css" />
  10. <link rel="stylesheet" type="text/css" href="http://static.flowplayer.org/tools/css/scrollable-buttons.css" />
  11. <link rel="stylesheet" type="text/css" href="http://static.flowplayer.org/tools/css/scrollable-navigator.css" />    
  12.     
  13. <?php
  14.     $vn_scrollingColHeight = 600;
  15.     $vn_numItemsPerCol = 3;
  16. ?>
  17.  
  18. <!-- wrapper for navigator elements -->
  19. <div class="navi"></div>
  20. <!-- "previous page" action -->
  21. <a class="prev browse left"></a>
  22. <!-- root element for scrollable -->
  23. <div class="scrollable" id=browsable>   
  24.    
  25.    <!-- root element for the items -->
  26.    <div class="items">
  27.  
  28.    
  29.      <?php
  30.     $vn_recently_added_count = 0;
  31.     
  32.         if(is_array($this->getVar("recently_added")) && sizeof($this->getVar("recently_added")) > 0){
  33.  
  34.         
  35. $contador=1;
  36.  
  37.     foreach($this->getVar("recently_added") as $vn_object_id => $vs_thumb){
  38.  
  39.   if ($contador==1){ echo '<div>';}
  40.   
  41. print caNavLink($this->request, $vs_thumb, '', 'Detail', 'Object', 'Show', array('object_id' => $vn_object_id)); 
  42.  
  43. if($contador==5){ 
  44.     echo '</div>'; 
  45.     
  46.         $contador=1;
  47.        
  48. }
  49.  
  50. else     {
  51. $contador++;
  52. }
  53.  
  54. $vn_recently_added_count++;
  55.         }
  56.     }
  57. ?>
  58.             
  59.    </div>
  60.    
  61. </div>
  62.  
  63. <!-- "next page" action -->
  64. <a class="next browse right"></a>
  65.  
  66. <br clear="all">
  67.  
  68. <!-- javascript coding -->
  69.  
  70.  
  71. <script>
  72. // What is $(document).ready ? See: http://flowplayer.org/tools/documentation/basics.html#document_ready
  73. $(document).ready(function() {
  74.  
  75. // initialize scrollable together with the navigator plugin
  76. $("#browsable").scrollable().navigator();   
  77. });
  78. </script>

Si alguien quiere que le explique como arme el codigo php con gusto..... espero le sirva a alguien.

Saludos