Collapse problem on jquery tabs
Hi.I am fairly new to JQuery so aoplogies in advance if I fail to explain correctly ot if I have posted in the wrong forum.
Essentially, I have a number of horizontal rows of icons that are collapsed by default on page load, when a user clicks an icon, a tab pane opens with a subset of icons for them to choose.
All this is working perfectly in Visual Studio, however I am having a problem when this is inserted into a Dot Net Nuke skin page.
Because DNN automatically loads its own libaries of JQuery I found out by trial and error that I can only add a reference to one additional script (which deals with collapse and click function) without causing a jquery conflict.
The tabs are all open on page load, but they do close correctly if clicked and apart from the load issue everything else is working fine.
Interestingly, if I add an image slider/gallery to the same page the Tabs work perfect, of course I would like a a better solution.
Anyway this is the uitabs-services script I added to DNN in the hope that someone can spot a workaround
$(function() {
$("#tabs-services-row1, #tabs-services-row2").tabs({
collapsible:true,
selected: -1,
fx: { height: 'toggle', duration: 'normal' }
});
return false;
});
$(function () {
$("#tabs-services-row1 ul.toptabs li a").click (function(){
$( "#tabs-services-row2" ).tabs('option', 'selected', -1);
});
$("#tabs-services-row2 ul.toptabs li a").click (function(){
$( "#tabs-services-row1," ).tabs('option', 'selected', -1);
});
$("#tabs-services-row1 .tab-pane a.btn-tabs-services-close").click (function(){
$( "#tabs-services-row1" ).tabs('option', 'selected', -1);
return false;
});
});
Regards Stuart
[moderator moved]