Friday, 13 September 2013

Jquery 1.9.1 integration with SharePoint 2010

Jquery 1.9.1 integration with SharePoint 2010

I am using SharePoint 2010 and included the JQuery Library as discussed in
the MSDN blog
'http://blogs.msdn.com/b/yojoshi/archive/2010/06/17/using-jquery-with-sharepoint-2010.aspx?'
This looks successful. However, I am not able to run the following JQuery
in a webpart.
I have the JQuery, HTML and CSS in 'http://jsfiddle.net/8HEd9/1/' Below is
the JQuery code that looks to have a problem.
function init()
{
// Grab the tab links and content divs from the page
var tabListItems = $('#tabs li');
// loop through all tab li tags
$('#tabs li').each(function (i, ele) {
// Assign click/focus events to the tab anchor/links
var tabLink = $(this).find('a').on('click', showTab).on('focus',
function () { $(this).blur(); });
var tabBody = $($(tabLink).attr('href'));
// highlight the first tab
if (i == 0) $(tabLink).addClass('selected');
// hide all the content divs but the first
if (i != 0) $(tabBody).hide();
});
//auto-rotate every 4 seconds
setInterval(function () {
var selectedTab = $('#tabs').find('li.on');
var index = $(selectedTab).index();
if (index < $('#tabs').find('li').length - 1)
index++;
else
index = 0;
$('#tabs').find('li:eq(' + index + ') a').click();
}, 4000);
}
This JQuery function in the fiddle is to render the html ul elements into
tabs and auto-toggle between them every 4 seconds.
This works well on static with the css. But, seems to not running all the
JQuery code. I do not see the effect of 'SetInterval' function when
deployed into SharePoint.
Kindly help me understand what I am missing. Thanks

No comments:

Post a Comment