Пишу виджет для сайта.
Проблема в следующем... ни как ни хочет подключаться файл стилей.
пишу с использованием:
jquery-1.5.1.js
jquery.history_remote.pack.js
jquery.tabs.pack.js
имеются 2 файла
PHP
<?php
header('Content-type: text/javascript');
if (!isset($_GET['callback'])) {
echo "ERROR: you must pass a callback parameter";
} else {
echo $_GET['callback']. '({"html":"<object type=\"application/x-shockwave-flash\" data=\"http://site.ru/player/uppod.swf\" width=\"500\" height=\"30\"><param name=\"bgcolor\" value=\"#ffffff\" ><param name=\"allowFullScreen\" value=\"true\" ><param name=\"allowScriptAccess\" value=\"always\" ><param name=\"wmode\" value=\"transparent\" ><param name=\"movie\" value=\"http://site.ru/player/uppod.swf\"/><param name=\"flashvars\" value=\"st=http://site.ru/player/styles/audio70-617.txt&file=http://site.ru:8000/radio\" ></object><div id=\"container-4\"><ul><li><a href=\"#fragment-10\"><span>Первая</span></a></li><li><a href=\"#fragment-11\"><span>Вторая</span></a></li><li><a href=\"#fragment-12\"><span>И еще одна</span></a></li></ul><div id=\"fragment-10\"><div id=\"last_track\">'. file_get_contents('http://site.ru/modules/mod_icecast/ajax.php?q=last_track').'</div><div id=\"last_tracks\">'. file_get_contents('http://site.ru/modules/mod_icecast/ajax.php?q=last_tracks').'</div></div><div id=\"fragment-11\"><div id=\"last_news\">'. file_get_contents('http://site.ru/modules/mod_icecast/ajax.php?q=last_news').'</div></div><div id=fragment-12><div align=\"center\">Нет афиш</div></div></div>"})';
}
?>
JAVASCRIPT
$(function() {
$("#container-4").tabs({ fxFade: true, fxSpeed: 'fast' });
});
var auto_refresh = setInterval(
function ()
{
jQuery('#last_tracks').load('modules/mod_icecast/ajax.php?q=last_tracks').fadeIn("slow");
jQuery('#last_news').load('modules/mod_icecast/ajax.php?q=last_news').fadeIn("slow");
jQuery('#last_track').load('modules/mod_icecast/ajax.php?q=last_track').fadeIn("slow");
}, 5000); // refresh every 10000 milliseconds
(function() {
// Создаем переменную JQuery в локальной области видимости
var jQuery;
/******** Загружаем jQuery, если он не загружен на странице *********/
if (window.jQuery === undefined || window.jQuery.fn.jquery !== '1.4.2') {
var script_tag = document.createElement('script');
script_tag.setAttribute("type","text/javascript");
script_tag.setAttribute("src",
"http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js");
script_tag.onload = scriptLoadHandler;
script_tag.onreadystatechange = function () { // Тоже самое только для IE
if (this.readyState == 'complete' || this.readyState == 'loaded') {
scriptLoadHandler();
}
};
// Прикрепляем наш тег к <head>,если такого не имеется то к documentElement
(document.getElementsByTagName("head")[0] ||
document.documentElement).appendChild(script_tag);
} else {
// Если версия jQuery, загруженная на странице, нам подходит
jQuery = window.jQuery;
main();
}
/******** Вызываем единожды после загрузки jQuery ******/
function scriptLoadHandler() {
// Возвращаем $ и window.jQuery к их предыдущему значению,
// а только что загруженный jQuery кладем в нашу локальную переменную jQuery
jQuery = window.jQuery.noConflict(true);
// приступаем к работе - вызываем нашу главную функцию
main();
}
/******** Главная функция ********/
function main() {
jQuery(document).ready(function($) {
/******* Загрузка CSS *******/
var css_link = $("<link>", {
rel: "stylesheet",
type: "text/css",
href: "http://site.ru/jquery.tabs.css"
});
css_link.appendTo('head');
/******* Загрузка HTML *******/
var jsonp_url =
"http://site.ru/widget.php?callback=?";
$.getJSON(jsonp_url, function(name) {
$('#example-widget-container').html(""+
name.html + "");
});
});
}
})(); // Сразу же после определения вызываем нашу безымянную функцию
Виджет на сторонних сайтах удачно загружает всю информацию, а вот файл стилей грузить не хочет, либо не может состыковаться по id=\"container-4\"... Странная ситуация и я все мозги сломал уже...
Заранее спасибо за помощь!