jquery y ejecucion de javascript Explico: ( y ya se es un tema muy debatido y conocido, pero solo necesito guia, y si se puede solucion)
Tengo mi pagina web, la que quiero que se cargue la mayoria del contenido en el index, tengo highslide cargado en el head, a su ves un script en ajax, y jquery.
Explico mas a detalle, highslide, solo ocupo para la galeria de imagenes, la cual solo carga el pequeño codigo de las imagenes para que sea una carga rapida de la galeria, ajax, es mas por responsabilidad, lo uso para llamar a "bienvenida.html" que se carga en el div "contenido", y jquery, que maneja el menu y hace que las demas secciones se carguen en "contenido".
Hasta aqui tdo perfecto, me las he arreglado para que todo funcione aparentemente bien y sin muchos errores (a excepcion de uno que me dice que se requiere un objeto en la linea 53, pero habeces aparece, y habeces no).
Quiero incorporar una seccion de videos usando la api de youtube, para esto pues se requiere que llame a su libreria desde su sitio, se supone que si lo agrego al head solo haria falta que se ejecutara el script que hace que en el div "videoControl" aparezca el widget. si lo agrego este en el index pues al momento de aparecer "videoControl" no haria nada, porque el script ya se ejecuto y el div llegaria tarde, para esto solo tendria que incluir (supongo) este script en la seccion que se carga en "contenido".
El problema aqui es que al cargar este contenido, no se ejecuta tal script, y no se muestra lo que deberia ser el widjet.
Investigando por aqui y por alla, vi que habia un problema con crossdomain con ajax, y no se si en jquery suceda lo mismo, pero en realidad no deberia haber problema ya que el script que se encarga de mostrar el widjet, no llama a ninguna libreria o script externo.
Lo mismo pasaria con google maps, o con algun otro widjet que quisiera tener en alguna seccion posterior.
Encontre aqui mismo una manera para ejecutar los scripts con prototype, o similar, pero la verdad spy bastante novato para ello.
Dejare los codigos de mi index (cabecera), como llamo a los enlaces, y el script de jquery, si no es posible hacerlo como deceo, creo que tendre que volver a el <iframe, pero no quiero tener que cargar cabeceras en cada llamada y hacer lenta la carga.
Cabecera:
Código HTML:
<head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <meta name="google-site-verification" content="KiTEj5y7ug0V7Gq7SD13yQXuARiN9HTnC4S2ikueS_8" /> <META name="y_key" content="5adf28cb47a241db"> <meta http-equiv="X-UA-Compatible" content="chrome=1"> <meta name="Keywords" content="videos, imagenes, musica, imagenes, bonsai, radio, arjona, spears, jackson, madona, gaga, stones, vangogh, miguel, desnuda, sexo, xxx, fox" /> <meta name="description" content="Radiobonsai, la unica estacion sin pelos en la lengua, pero con muchos en las manos, hablar la neta es nuestra verdad, programas interesantes, y temas que valen la pena." /> <title>[:: Radiobonsai® 6.0 ::]</title> <link rel="stylesheet" href="style.css" type="text/css" charset="utf-8" /> <!--jq=jquery :P--> <script type="text/javascript" src="jq.js"></script> <script type="text/javascript" src="locutor.js"></script> <script type="text/javascript" src="ajax.js"></script> <link rel="shortcut icon" href="favicon.ico" type="image/x-icon" /> <!--api de youtube--> <!-- ++Begin Video Search Control Wizard Generated Code++ --> <!-- // Created with a Google AJAX Search Wizard // http://code.google.com/apis/ajaxsearch/wizards.html --> <!-- // The Following div element will end up holding the Video Search Control. // You can place this anywhere on your page. --> <!-- Ajax Search Api and Stylesheet // Note: If you are already using the AJAX Search API, then do not include it // or its stylesheet again // // The Key Embedded in the following script tag is designed to work with // the following site: // http://radiobonsai.webcindario.com --> <script src="http://www.google.com/uds/api?file=uds.js&v=1.0&source=uds-vsw&key=ABQIAAAAFerQEaPZztpqda0RTszN8xQresrHrgQ_kSRJjAGZJpBwlL3ODxSIfb36sjcXU4yglzBL0AkxqeaYZA" type="text/javascript"></script> <!-- Video Search Control and Stylesheet --> <script type="text/javascript"> window._uds_vsw_donotrepair = true; </script> <script src="http://www.google.com/uds/solutions/videosearch/gsvideosearch.js?mode=new" type="text/javascript"></script> <!-- fin llamada a la api de youtube--> <!--Codigo para recargar un reproductor de streamng en flash--> <script type="text/javascript"> function play2() { document.getElementById('repro').innerHTML = "<embed src='player/player.swf' wmode='transparent' width='200' height='20' allowscriptaccess='always' allowfullscreen='false' flashvars='type=mp3&file=http://scfire-mtc-aa02.stream.aol.com:80/stream/1024/;stream.nsv&autostart=true&showstop=true&backcolor=cccccc&frontcolor=000000&lightcolor=666666&screencolor=009900&volume=80'/>"; } </script> <!--Este es para un spoiler que se usa en la seccion de chat--> <SCRIPT language="javascript"> function MostrarOcultar (objetoVisualizar) { if (document.all[objetoVisualizar].style.display=='none') { document.all[objetoVisualizar].style.display='block'; } else { document.all[objetoVisualizar].style.display='none'; } } </SCRIPT> <!--comiensa el highslide--> <!---------------------------------------------------------------------------------------------------> <!--explorer <link rel="stylesheet" type="text/css" href="highslide/highslide-ie6.css" /> --> <script type="text/javascript" src="highslide/highslide-with-gallery.js"></script> <link rel="stylesheet" type="text/css" href="highslide/highslide.css" /> <!--aqui comiensa el script de la galeria--> <!-- 2) Optionally override the settings defined at the top of the highslide.js file. The parameter hs.graphicsDir is important! --> <script type="text/javascript"> hs.graphicsDir = 'highslide/graphics/'; hs.align = 'center'; hs.transitions = ['expand', 'crossfade']; hs.outlineType = 'rounded-white'; hs.fadeInOut = true; hs.numberPosition = 'caption'; hs.dimmingOpacity = 0.75; // Add the controlbar if (hs.addSlideshow) hs.addSlideshow({ //slideshowGroup: 'group1', interval: 5000, repeat: false, useControls: true, fixedControls: 'fit', overlayOptions: { opacity: .75, position: 'bottom center', hideOnMouseOut: true } }); </script> <!-- Aqui termina el script de highslide--> </head>
Ahora como llamo los enlaces:
Código HTML:
<!-- en el menu--> <a class="mnu" href="bienvenida.html"> Inicio </a>
Código HTML:
<script type="text/javascript"> $(document).ready( function(){ $(".mnu").each(function(){ var href = $(this).attr("href"); $(this).click(function(){ $("#contenido") .load(href) .hide("slow") ; //Le damos efecto $(this).attr({ href: "javascript:"}); $("#contenido") .show("slow") ; }); }); }, //esta linea es necesaria para cargar el inicio, de otro modo el contenido quedaria vacio al cargar la pagina, y el ponerle en el index haria que no pudiese recargarlo despues con un link sin usar mas codigo.(es con ajax.js) Enviar('bienvenida.html', 'contenido') ); </script>
El contenido de la seccion simplemente seria:
Código HTML:
<script type="text/javascript"> function LoadVideoSearchControl() { var options = { twoRowMode : true }; var videoSearch = new GSvideoSearchControl( document.getElementById("videoControl"), [{ query : "bonsairadio"}], null, null, options); } // arrange for this function to be called during body.onload // event processing GSearch.setOnLoadCallback(LoadVideoSearchControl); </script> <!-- --End Video Search Control Wizard Generated Code-- --> <div id="videoControl" align="center"> <span style="color:#676767;font-size:11px;margin:10px;padding:4px;">Loading...</span> </div>
Gracias de antemano por su ayuda, ojala y puedan darme asesoria, un empujon es lo que necesito, gracias.
PD, no se si viole las reglas del foro, pero pondre la direccion de mi web para que se den una idea.
Código HTML:
<a href= http://radiobonsai.webcindario.com>Gracias, si violo las reglas corregire</a>
