Foros del Web » Programando para Internet » Javascript » Frameworks JS »

agregar subitems a galería HTML5

Estas en el tema de agregar subitems a galería HTML5 en el foro de Frameworks JS en Foros del Web. hola amigos econtre este script donde genera una galería de vídeos en html 5 todo bien pero el xml que genera o la estructura que ...
  #1 (permalink)  
Antiguo 08/10/2012, 19:35
 
Fecha de Ingreso: febrero-2007
Mensajes: 230
Antigüedad: 13 años, 8 meses
Puntos: 1
agregar subitems a galería HTML5

hola amigos econtre este script donde genera una galería de vídeos en html 5 todo bien pero el xml que genera o la estructura que genera es de esta maneara primero coloco el script que genera el xml y la galería y luego coloco el xml generado
Código Javascript:
Ver original
  1. <script type="text/javascript">
  2. // properties
  3. var XML_PATH = "xml/01.xml";
  4. var video_width;
  5. var video_height;
  6. var videos_array=new Array();
  7. // init the application
  8. function init()
  9.     {
  10. // call loadXML function
  11.     loadXML();
  12.     }
  13. // XML loading
  14. function loadXML()
  15. {
  16.     $.ajax({
  17.             type: "GET",
  18.             url: XML_PATH,
  19.             dataType: "xml",
  20.             success: function onXMLloaded(xml)
  21.             {
  22.                 // set video_width and video_height
  23.                 video_width=$(xml).find("videos").attr("width");
  24.                 video_height=$(xml).find("videos").attr("height");
  25.                
  26.                 // loop for each item
  27.                 $(xml).find('item').each(function loopingItems(value)
  28.                
  29.                 {  
  30.                     // create an object
  31.                     var obj={title:$(this).find("title").text(), mp4:$(this).find("mp4").text(), ogg:$(this).find("ogg").text(), webm:$(this).find("webm").text(), description:$(this).find("description").text(), img:$(this).find("img").text()};
  32.                     videos_array.push(obj);
  33.                    
  34.                     // append <ul> and video title
  35.                     $("#mycustomscroll").append('<ul>');
  36.                     $("#mycustomscroll").append('<a><li id="item">'+"<strong class='titulo'>"+obj.title+'</strong></li></a>');
  37.                 });
  38.                
  39.                 // close </ul>
  40.                 $("#mycustomscroll").append('</ul>');
  41.                 // append video tag player
  42.                 $("#leftcolumn").append('<video width="'+video_width+'" height="'+video_height+'" controls="controls"><source src="'+videos_array[0].mp4+'" type="video/mp4" /><source src="'+videos_array[0].ogg+'" type="video/ogg" /><source src="'+videos_array[0].webm+'" type="video/webm" />Your browser does not support the video tag.</video>');
  43.                 // append description
  44.                 $("#description").append(videos_array[0].description);
  45.                
  46.                 // call addListeners function
  47.                 addListeners();
  48.             }
  49.     });
  50. }
  51.  
  52. // add <li> listener
  53. function addListeners()
  54. {
  55.     // loop for each list item
  56.     $('#mycustomscroll li').each(function looping(index)
  57.     {
  58.         // onclick...
  59.         $(this).click(function onItemClick()
  60.         {
  61.             // empty left column and description
  62.             $("#leftcolumn").empty();
  63.             $("#description").empty();
  64.             // append video tag
  65.             $("#leftcolumn").append('<video width="'+video_width+'" height="'+video_height+'" controls="controls" autoplay="autoplay"><source src="'+videos_array[index].mp4+'" type="video/mp4" /><source src="'+videos_array[index].ogg+'" type="video/ogg" /><source src="'+videos_array[index].webm+'" type="video/webm" />Your browser does not support the video tag.</video>');
  66.             // append description
  67.             $("#description").append(videos_array[index].description);
  68.         });
  69.     });
  70. }
  71. </script>

Código HTML:
Ver original
  1. <?xml version="1.0" encoding="UTF-8"?>
  2. <videos width="550" height="368">
  3.     <item>
  4.         <title>mi titulo</title>
  5.         <mp4>http://css.flepstudio.org/demo/video_player/assets/videos/21_Jump_Street.mp4</mp4>
  6.         <ogg>http://css.flepstudio.org/demo/video_player/assets/videos/21_Jump_Street.ogv</ogg>
  7.         <description><![CDATA[<ul><li>texto en viñetas</li></ul>]]></description>
  8.     </item>
  9. </videos>

ok esa estrucrura y ese xml generado me da eseresultado y mecrea un item por video con su titulo y descripcion, lo que me piden es poder generar como a cada item como un subitem, algo asi com una estructura de arbol algo asi

1.nombre 1
1.1. subnombre1
1.2. subnombre2
2 nombre 2

y así sucesivamente es posible gracias y dejo los codigos

gracias.

Etiquetas: ajax, html, html5
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 04:27.