I saw another post about this problem and I tried the suggested solutions, but none of them worked for me. I have the following code in an html module:
< div class="dnnForm" id="tabs-demo" >
< ul class="dnnAdminTabNav" >
< li >< a href="#ChristopherColumbus" >Christopher Columbus< /a >< /li >
< li >< a href="#IsaacNewton" >Isaac Newton< /a >< /li >
< li >< a href="#JohannesGutenberg" >Johannes Gutenberg< /a >< /li >
< /ul >
< div id="ChristopherColumbus" class="dnnClear" >
< div class="dnnRight" style="width: 62%; margin-left: 2%;" >
< h1 >Christopher Columbus< /h1 >
< p >Italian navigator, colonizer and explorer whose voyages led to general European awareness of the American continents.< /p >
< /div >
< /div >
< div id="IsaacNewton" class="dnnClear" >
< div class="dnnRight" style="width: 62%; margin-left: 2%; " >
< h1 >Isaac Newton< /h1 >
< p >English physicist, mathematician, astronomer, natural philosopher, alchemist, and theologian. His law of universal gravitation and three laws of motion laid the groundwork for classical mechanics.< /p >
< /div >
< /div >
< div id="JohannesGutenberg" class="dnnClear" >
< div class="dnnRight" style="width: 62%; margin-left: 2%;" >
< h1 >Johannes Gutenberg< /h1 >
< p >German printer who invented the mechanical printing press.< /p >
< /div >
< /div >
< /div >
I have the following code in the Module header (I've also tried putting it into the module footer and the page header):
< script type="text/javascript" >
jQuery(function ($) {
$('#tabs-demo').dnnTabs();
});
jQuery(function ($) {
$('#tabs-demo').dnnTabs({selected: 0});
});
< /script >
As long as I'm logged in as host, my tabs work just fine. When I am not logged in, the tab headers are displayed, but are not functional and the tab contents are all visible (not tabbed). I've been told that it looks like the jquery is not being loaded. Why and how can I fix this?