Menu
▾
▴
[TWiki-Dev] [SVN] MichaelDaum r16602 - in twiki/trunk/JQueryPlugin: data/Sandbox lib/TWiki/Plugins/JQueryPlugin pub/TWiki/JQueryPlugin
|
From: <de...@de...> - 2008-04-02 18:47:53
|
Author: MichaelDaum Date: 2008-04-02 13:47:56 -0500 (Wed, 02 Apr 2008) New Revision: 16602 Trac url: http://develop.twiki.org/trac/changeset/16602 Added: twiki/trunk/JQueryPlugin/pub/TWiki/JQueryPlugin/jquery.superfish.css twiki/trunk/JQueryPlugin/pub/TWiki/JQueryPlugin/jquery.superfish.js twiki/trunk/JQueryPlugin/pub/TWiki/JQueryPlugin/jquery.superfish.uncompressed.css twiki/trunk/JQueryPlugin/pub/TWiki/JQueryPlugin/jquery.superfish.uncompressed.js Modified: twiki/trunk/JQueryPlugin/data/Sandbox/JQueryPluginExamples.txt twiki/trunk/JQueryPlugin/lib/TWiki/Plugins/JQueryPlugin/Core.pm twiki/trunk/JQueryPlugin/pub/TWiki/JQueryPlugin/Makefile twiki/trunk/JQueryPlugin/pub/TWiki/JQueryPlugin/jquery-all.css twiki/trunk/JQueryPlugin/pub/TWiki/JQueryPlugin/jquery-all.js twiki/trunk/JQueryPlugin/pub/TWiki/JQueryPlugin/jquery.tabpane.css twiki/trunk/JQueryPlugin/pub/TWiki/JQueryPlugin/jquery.tabpane.js Log: Item5358:Item5493: * added select parameter to TABPANE to have the n-th tab open by default * added superfish hover menu Modified: twiki/trunk/JQueryPlugin/data/Sandbox/JQueryPluginExamples.txt =================================================================== --- twiki/trunk/JQueryPlugin/data/Sandbox/JQueryPluginExamples.txt 2008-03-31 18:07:06 UTC (rev 16601) +++ twiki/trunk/JQueryPlugin/data/Sandbox/JQueryPluginExamples.txt 2008-04-02 18:47:56 UTC (rev 16602) @@ -1,4 +1,4 @@ -%META:TOPICINFO{author="micha" date="1202906066" format="1.1" reprev="1.1" version="1.1"}% +%META:TOPICINFO{author="TWikiContributor" date="1202906066" format="1.1" reprev="1.1" version="$Rev$"}% ---+!! %TOPIC% Demo of the <nop>TWikiWidgets implemented by the %TWIKIWEB%.JQueryPlugin Modified: twiki/trunk/JQueryPlugin/lib/TWiki/Plugins/JQueryPlugin/Core.pm =================================================================== --- twiki/trunk/JQueryPlugin/lib/TWiki/Plugins/JQueryPlugin/Core.pm 2008-03-31 18:07:06 UTC (rev 16601) +++ twiki/trunk/JQueryPlugin/lib/TWiki/Plugins/JQueryPlugin/Core.pm 2008-04-02 18:47:56 UTC (rev 16602) @@ -25,11 +25,16 @@ my ($session, $params, $theTopic, $theWeb) = @_; my $tpId = 'jqTabPane'.($tabPaneCounter++); + my $select = $params->{select}; + $select =~ s/[^\d]//go; + $select ||= 1; + + TWiki::Func::addToHEAD($tpId, <<"EOS"); <script type="text/javascript"> jQuery(function(\$) { - \$("#$tpId").tabpane(); + \$("#$tpId").tabpane({select:$select}); }); </script> EOS Modified: twiki/trunk/JQueryPlugin/pub/TWiki/JQueryPlugin/Makefile =================================================================== --- twiki/trunk/JQueryPlugin/pub/TWiki/JQueryPlugin/Makefile 2008-03-31 18:07:06 UTC (rev 16601) +++ twiki/trunk/JQueryPlugin/pub/TWiki/JQueryPlugin/Makefile 2008-04-02 18:47:56 UTC (rev 16602) @@ -1,12 +1,16 @@ TWIKIROOT=~/twiki/MAIN -TARGET= jquery-all.js jquery-all.css +TARGET= \ + jquery-all.js \ + jquery-all.css \ + jquery.superfish.js \ + jquery.superfish.css + MINIFYJS=$(TWIKIROOT)/tools/minifyjs MINIFYCSS=$(TWIKIROOT)/tools/minifycss all: $(TARGET) clean: - rm -f $(TARGET) JS_SOURCES=\ @@ -41,3 +45,10 @@ @echo creating $@ @$(MINIFYCSS) $(CSS_SOURCES) > $@ +jquery.superfish.js: jquery.superfish.uncompressed.js + @echo creating $@ + @$(MINIFYJS) $< > $@ + +jquery.superfish.css: jquery.superfish.uncompressed.css + @echo creating $@ + @$(MINIFYCSS) $< > $@ Modified: twiki/trunk/JQueryPlugin/pub/TWiki/JQueryPlugin/jquery-all.css =================================================================== --- twiki/trunk/JQueryPlugin/pub/TWiki/JQueryPlugin/jquery-all.css 2008-03-31 18:07:06 UTC (rev 16601) +++ twiki/trunk/JQueryPlugin/pub/TWiki/JQueryPlugin/jquery-all.css 2008-04-02 18:47:56 UTC (rev 16602) @@ -12,7 +12,7 @@ .jqTreeview.gray li.lastExpandable{background-image:url(images/treeview-gray.gif);}.jqTreeview.famfamfam li{background-image:url(images/treeview-famfamfam-line.gif);}.jqTreeview.famfamfam .hitarea, .jqTreeview.famfamfam li.lastCollapsable, .jqTreeview.famfamfam li.lastExpandable{background-image:url(images/treeview-famfamfam.gif);} -.jqTabPane{display:none;}.jqTabPane form{margin:0px;padding:0px;}.jqTab{display:none;margin-top:-1px;border:1px solid #BDBEC5;padding:2px;}.jqTab.current{display:block;}.jqTabContents{clear:both;padding:5px;overflow-x:hidden;overflow-y:auto;}ul.jqTabGroup{margin:0px;padding:0px;height:29px;line-height:100%;list-style:none;}ul.jqTabGroup li{background-color:transparent !important;background-image:url('tab_right.gif') !important;background-repeat:no-repeat !important;background-position:right top !important;float:left;padding:0px 3px 0px 0px !important;margin:0px 4px 0px 0px !important;height:29px;}ul.jqTabGroup a:active, +.jqTabPane{display:none;}.jqTabPane form{margin:0px;padding:0px;}.jqTab{display:none;margin-top:-1px;border:1px solid #BDBEC5;padding:2px;}.jqTab.current{display:block;}.jqTabContents{clear:both;padding:5px;overflow-x:hidden;overflow-y:auto;}ul.jqTabGroup{margin:0px !important;padding:0px !important;height:29px;list-style:none;}ul.jqTabGroup li{background-color:transparent !important;background-image:url('tab_right.gif') !important;background-repeat:no-repeat !important;background-position:right top !important;float:left;padding:0px 3px 0px 0px !important;margin:0px 4px 0px 0px !important;height:29px;line-height:100%;}ul.jqTabGroup a:active, ul.jqTabGroup a:hover, ul.jqTabGroup a:link, ul.jqTabGroup a{text-decoration:none;white-space:nowrap;background-color:transparent !important;background-image:url('tab_left.gif') !important;background-repeat:no-repeat !important;background-position:left top !important;color:black;float:left;margin:0px 0px 0px 0px !important;padding:4px 8px 0px 18px !important;height:25px;font-size:12px;}ul.jqTabGroup a:active, Modified: twiki/trunk/JQueryPlugin/pub/TWiki/JQueryPlugin/jquery-all.js =================================================================== --- twiki/trunk/JQueryPlugin/pub/TWiki/JQueryPlugin/jquery-all.js 2008-03-31 18:07:06 UTC (rev 16601) +++ twiki/trunk/JQueryPlugin/pub/TWiki/JQueryPlugin/jquery-all.js 2008-04-02 18:47:56 UTC (rev 16602) @@ -148,7 +148,8 @@ if(false){$(".jqRounded").roundedCorners();} if(false){$(".twikiToc").each(function(){$(this).prepend("<a class='twikiTocToggle'>[hide]</a>")});$(".twikiTocToggle").css("float","right").click(function(){$("> ul",$(this).parent()).slideToggle({easing:'easeInOutQuad',duration:300});if($(this).text()=="[hide]"){$(this).text("[show]");}else{$(this).text("[hide]");}});} if($jqTreeviews){$jqTreeviews.css('display','block');}});; -(function($){$.fn.tabpane=function(options){writeDebug("called tabpane()");var opts=$.extend({},$.fn.tabpane.defaults,options);return this.each(function(){var thisOpt=$.extend({},opts,$(this).data());var $tabContainer=$(this);var $tabGroup=$('<ul class="jqTabGroup"></ul>').prependTo($tabContainer);var isFirstTab=1;var currentTabId;$(this).children(".jqTab").each(function(){var title=$('h2',this).eq(0).remove().text();$tabGroup.append('<li'+(isFirstTab?' class="current"':'')+'><a href="javascript:void(0)" data="'+this.id+'">'+title+'</a></li>');if(isFirstTab){isFirstTab=0;currentTabId=this.id;$(this).addClass("current");}else{writeDebug("hiding "+this.id);$(this).removeClass("current");}});$(".jqTabGroup li > a",this).click(function(){$(this).blur();var newTabId=$(this).attr('data');if(newTabId!=currentTabId){writeDebug("switch from "+currentTabId+" to "+newTabId);var $currentTab=$("#"+currentTabId);var $newTab=$("#"+newTabId);var data=$newTab.data();if(typeof(data.beforeHandler)!="undefined"){var command="{ var oldTab = '"+currentTabId+"'; var newTab = '"+newTabId+"'; "+data.beforeHandler+";}";writeDebug("exec "+command);} -$(this).parent().parent().children("li").removeClass("current");$(this).parent().addClass("current");$currentTab.removeClass("current");$newTab.addClass("current");if(typeof(data.afterHandler)!="undefined"){var command="{ var oldTab = '"+currentTabId+"'; var newTab = '"+newTabId+"'; "+data.afterHandler+";}";writeDebug("exec "+command);eval(command);} +(function($){$.fn.tabpane=function(options){writeDebug("called tabpane()");var opts=$.extend({},$.fn.tabpane.defaults,options);return this.each(function(){var thisOpt=$.extend({},opts,$(this).data());var $tabContainer=$(this);var $tabGroup=$('<ul class="jqTabGroup"></ul>').prependTo($tabContainer);var index=1;var currentTabId;$(this).children(".jqTab").each(function(){var title=$('h2',this).eq(0).remove().text();$tabGroup.append('<li'+(index==opts.selected?' class="current"':'')+'><a href="javascript:void(0)" data="'+this.id+'">'+title+'</a></li>');if(index==opts.selected){currentTabId=this.id;$(this).addClass("current");}else{writeDebug("hiding "+this.id);$(this).removeClass("current");} +index++;});$(".jqTabGroup li > a",this).click(function(){$(this).blur();var newTabId=$(this).attr('data');if(newTabId!=currentTabId){writeDebug("switch from "+currentTabId+" to "+newTabId);var $currentTab=$("#"+currentTabId);var $newTab=$("#"+newTabId);var data=$newTab.data();if(typeof(data.beforeHandler)!="undefined"){var command="{ oldTab = '"+currentTabId+"'; newTab = '"+newTabId+"'; "+data.beforeHandler+";}";writeDebug("exec "+command);} +$(this).parent().parent().children("li").removeClass("current");$(this).parent().addClass("current");$currentTab.removeClass("current");$newTab.addClass("current");if(typeof(data.afterHandler)!="undefined"){var command="{ oldTab = '"+currentTabId+"'; newTab = '"+newTabId+"'; "+data.afterHandler+";}";writeDebug("exec "+command);eval(command);} currentTabId=newTabId;} -return false;});$(this).css("display","block");});};function writeDebug(msg){if($.fn.tabpane.defaults.debug){if(window.console&&window.console.log){window.console.log("DEBUG: TabPane - "+msg);}else{alert(msg);}}};$.fn.tabpane.defaults={debug:false};})(jQuery);; +return false;});$(this).css("display","block");});};function writeDebug(msg){if($.fn.tabpane.defaults.debug){if(window.console&&window.console.log){window.console.log("DEBUG: TabPane - "+msg);}else{alert(msg);}}};$.fn.tabpane.defaults={debug:false,selected:1};})(jQuery);; Added: twiki/trunk/JQueryPlugin/pub/TWiki/JQueryPlugin/jquery.superfish.css =================================================================== --- twiki/trunk/JQueryPlugin/pub/TWiki/JQueryPlugin/jquery.superfish.css (rev 0) +++ twiki/trunk/JQueryPlugin/pub/TWiki/JQueryPlugin/jquery.superfish.css 2008-04-02 18:47:56 UTC (rev 16602) @@ -0,0 +1,13 @@ +.natMain ul.superfish li{padding-left:1em;}.superfish{margin:0;padding:0;list-style:none;line-height:2.5em;}ul.superfish li{background-image:none;}.superfish ul{position:absolute;top:-999em;width:9.45em;}.superfish ul li{width:100%;}.superfish li{background:none;float:left;position:relative;z-index:99;}.superfish a{display:block;}.superfish li:hover ul, ul.superfish li.sfHover ul +{left:-1px;top:2.5em;}.superfish li:hover li ul, +.superfish li.sfHover li ul{top:-999em;}.superfish li li:hover ul, ul.superfish li li.sfHover ul {left:10.45em;top:-1px;}.superfish li li:hover li ul, +.superfish li li.sfHover li ul{top:-999em;}.superfish li li li:hover ul, ul.superfish li li li.sfHover ul {left:10.45em;top:-1px;}.superfish li:hover ul, +.superfish li li:hover ul, +.superfish li li li:hover ul{top:-999em;}embed, object{position:relative;z-index:0;}ul.superfish{float:left;margin-bottom:1.5em;color:white;}ul.superfish li{background-color:#BDD2FF;border-left:1px solid #fff;border-top:1px solid #CFDEFF;width:9.45em;}ul.superfish a{text-decoration:none;color:inherit;}DIS_ul.superfish a{padding:.75em 0;text-decoration:none;text-indent:2em;}ul.superfish li:hover, +ul.superfish li.sfHover, +ul.superfish a:focus, +ul.superfish a:hover, +ul.superfish a:active{background-color:#CFDEFF;background-image:url(MenuArrow.gif);background-position:95% 85%;background-repeat:no-repeat;}ul.superfish li li{background-color:#AABDE6;}ul.superfish li li li{background-color:#9AAEDB;}ul.superfish li li li li{background-color:#707E9F;}ul.superfish li.sfHover ul{opacity:0.95;}ul.superfish li ul li ul li ul li, +ul.superfish li ul li ul li, +ul.superfish li ul li, +ul.superfish li{background-image:url(MenuArrow.gif);background-position:95% 85%;background-repeat:no-repeat;}ul.superfish .sfPath{background:red;} Added: twiki/trunk/JQueryPlugin/pub/TWiki/JQueryPlugin/jquery.superfish.js =================================================================== --- twiki/trunk/JQueryPlugin/pub/TWiki/JQueryPlugin/jquery.superfish.js (rev 0) +++ twiki/trunk/JQueryPlugin/pub/TWiki/JQueryPlugin/jquery.superfish.js 2008-04-02 18:47:56 UTC (rev 16602) @@ -0,0 +1,6 @@ +(function($){$.superfish={};$.superfish.o=[];$.superfish.op={};$.superfish.defaults={hoverClass:'sfHover',pathClass:'overideThisToUse',delay:800,animation:{opacity:'show'},speed:'normal',oldJquery:false,disableHI:false,onInit:function(){},onBeforeShow:function(){},onShow:function(){},onHide:function(){}};$.fn.superfish=function(op){var bcClass='sfbreadcrumb',over=function(){var $$=$(this),menu=getMenu($$);getOpts(menu,true);clearTimeout(menu.sfTimer);$$.showSuperfishUl().siblings().hideSuperfishUl();},out=function(){var $$=$(this),menu=getMenu($$);var o=getOpts(menu,true);clearTimeout(menu.sfTimer);if(!$$.is('.'+bcClass)){menu.sfTimer=setTimeout(function(){$$.hideSuperfishUl();if(o.$path.length){over.call(o.$path);}},o.delay);}},getMenu=function($el){return $el.parents('ul.superfish:first')[0];},getOpts=function(el,menuFound){el=menuFound?el:getMenu(el);return $.superfish.op=$.superfish.o[el.serial];},hasUl=function(){return $.superfish.op.oldJquery?'li[ul]':'li:has(ul)';};return this.each(function(){var s=this.serial=$.superfish.o.length;var o=$.extend({},$.superfish.defaults,op);o.$path=$('li.'+o.pathClass,this).each(function(){$(this).addClass(o.hoverClass+' '+bcClass) +.filter(hasUl()).removeClass(o.pathClass);});$.superfish.o[s]=$.superfish.op=o;$(hasUl(),this)[($.fn.hoverIntent&&!o.disableHI)?'hoverIntent':'hover'](over,out) +.not('.'+bcClass) +.hideSuperfishUl();var $a=$('a',this);$a.each(function(i){var $li=$a.eq(i).parents('li');$a.eq(i).focus(function(){over.call($li);}).blur(function(){out.call($li);});});o.onInit.call(this);}).addClass('superfish');};$.fn.extend({hideSuperfishUl:function(){var o=$.superfish.op,$ul=$('li.'+o.hoverClass,this).add(this).removeClass(o.hoverClass) +.find('>ul').hide().css('visibility','hidden');o.onHide.call($ul);return this;},showSuperfishUl:function(){var o=$.superfish.op,$ul=this.addClass(o.hoverClass) +.find('>ul:hidden').css('visibility','visible');o.onBeforeShow.call($ul);$ul.animate(o.animation,o.speed,function(){o.onShow.call(this);});return this;}});$(window).unload(function(){$('ul.superfish').each(function(){$('li',this).unbind('mouseover','mouseout','mouseenter','mouseleave');});});})(jQuery);; Added: twiki/trunk/JQueryPlugin/pub/TWiki/JQueryPlugin/jquery.superfish.uncompressed.css =================================================================== --- twiki/trunk/JQueryPlugin/pub/TWiki/JQueryPlugin/jquery.superfish.uncompressed.css (rev 0) +++ twiki/trunk/JQueryPlugin/pub/TWiki/JQueryPlugin/jquery.superfish.uncompressed.css 2008-04-02 18:47:56 UTC (rev 16602) @@ -0,0 +1,281 @@ +/**************** ESSENTIAL STYLES ***************/ +/* remove any default styles */ +.natMain ul.superfish li { + padding-left:1em; +} +.superfish { + margin:0; + padding:0; + list-style:none; + line-height:2.5em; +} +ul.superfish li { + background-image:none; +} + +/* nested submenu ul elements */ +.superfish ul { + position:absolute; /* remove from flow and allow positioning */ + top:-999em; + /* hide submenu in screen-reader and search-engine friendly way */ + width:9.45em; + /* VARIABLE. Must have a width for menu items to inherit. Use ems so font + * scaling does not break design + */ +} +/* submenu items */ +.superfish ul li { + width: 100%; + /* stretch submenu items to width of submenu ul width (see .superfish ul + * rules above). When link text runs over more than one line, use padding + * and an explicit width for the anchor instead of width:100% and + * text-indent. Example below in the SKIN section + */ +} + +/* all li elements */ +.superfish li { + background:none; + float:left; + /* must float all li elements. Vertical submenu items are restrained by + * parent ul width (see .superfish ul rules above) + */ + position:relative; + /* make child submenu ul position relative to parent li */ + z-index:99; + /* ensure submenus appear above other page items. Increase if needed, but + * do not exceed thickbox overlay z-index! + */ +} + +/* all anchor elements */ +.superfish a { + display:block; /* make IE6 obey width when text-indent is used */ +} + +/**** Position of second tier of.superfish ****/ +.superfish li:hover ul, + /* this pure CSS hover is overridden by the .superfish rules below which are + * applied only when JavaScript is available. This way, the menu degrades to + * regular CSS dropdown when JavaScript is .superfishailable + */ +ul.superfish li.sfHover ul +/* this is the familiar IE6 hover support. With Superfish, all browsers use + * this rule when JS is available. This is because the JS needs to be able to + * control hide and reveal delays and animations without the pure CSS rule + * intruding. Note the tag selector ul.superfish instead of just .superfish - + * this gives it the most specificity of all and makes it trump all other + * positioning rules, including the .superfish overrides below + */ +{ + left:-1px; /* position first submenu directly under parent li */ + top:2.5em; + /* VARIABLE. This is calculated by adding 1em text height to top and bottom + * anchor element padding (original skin: .75em top + .75em bottom + 1em + * text height = 2.5em) + */ +} + +/**** Position of third tier of.superfish ****/ +/* Note that this rule must appear here in the code order in order for it to + * override previous positioning rules so that this and subsequent nested + * submenus still remain hidden when the parent submenu is shown. Do not group + * these selectors with other top:-999em rules + */ +.superfish li:hover li ul, +.superfish li.sfHover li ul { + top:-999em; /* hide submenu in screen-reader and search-engine friendly way */ +} +/* DO NOT attempt to group these selectors with similar earlier rules. The code + * order is important so the rules override previous ones correctly + */ +.superfish li li:hover ul, + /* this pure CSS hover is overridden by the .superfish rules below which are + * applied only when JavaScript is available. This way, the menu degrades to + * regular CSS dropdown when JavaScript is .superfishailable + */ +ul.superfish li li.sfHover ul + /* this is the familiar IE6 hover support. With Superfish, all browsers use + * this rule when JS is available. This is because the JS needs to be able to + * control hide and reveal delays and animations without the pure CSS rule + * intruding. Note the tag selector ul.superfish instead of just .superfish - + * this gives it the most specificity of all and makes it trump all other + * positioning rules, including the .superfish overrides below + */ + { + left:10.45em; + /* VARIABLE. Offset subsequent submenus to the right by the amount you set + * for the submenu widths (see .superfish ul rules above) + */ + top:-1px; /* position subsequent submenus horizontally aligned to parent li */ +} + +/**** Position of fourth tier of.superfish + * (not used on main demo page. You could delete this block for a three tiered.superfish) i + ****/ + +/* Note that this rule must appear here in the code order in order for it to + * override previous positioning rules so that this and subsequent nested + * submenus still remain hidden when the parent submenu is shown. Do not group + * these selectors with other top:-999em rules + */ +.superfish li li:hover li ul, +.superfish li li.sfHover li ul { + top:-999em; /* hide submenu in screen-reader and search-engine friendly way */ +} +/* DO NOT attempt to group these selectors with similar earlier rules. The code + * order is important so the rules override previous ones correctly + */ +.superfish li li li:hover ul, + /* this pure CSS hover is overridden by the .superfish rules below which are + * applied only when JavaScript is available. This way, the menu degrades to + * regular CSS dropdown when JavaScript is .superfishailable + */ +ul.superfish li li li.sfHover ul + /* this is the familiar IE6 hover support. With Superfish, all browsers use + * this rule when JS is available. This is because the JS needs to be able to + * control hide and reveal delays and animations without the pure CSS rule + * intruding. Note the tag selector ul.superfish instead of just .superfish - + * this gives it the most specificity of all and makes it trump all other + * positioning rules, including the .superfish overrides below + */ + { + left:10.45em; + /* VARIABLE. Offset subsequent submenus to the right by the amount you set + * for the submenu widths (see .superfish ul rules above) + */ + top:-1px; /* position subsequent submenus horizontally aligned to parent li */ +} + +/**** Position of further tiers of.superfish ****/ +/* To add further tiers, you need copy the previous block of code (everything + * back until the "Position of fourth tier of.superfish" comment) and paste it + * in here. Then add an extra li just after .superfish in each of the pasted + * selectors. So the new block will differ from the copied block in the same + * way that the block for the fourth tier differs from the block for the third + * tier. + */ + +/**** Very important ****/ +/* this negates the pure CSS hovers so submenu remains hidden and JS controls + * when and how it appears. This is in turn is overridden by the .sfHover rules + * above as they have greater specificity + */ + +/* notice there are three selectors here. You need three for a four tier menu + * system. If you had a five tier system you would copy the last selector of + * these three and paste it below to create a fourth selector and add another + * li just after the .superfish part. On the other hand if you only had a three + * tiered menu you could delete the third line here and save some file size. + */ +.superfish li:hover ul, +.superfish li li:hover ul, +.superfish li li li:hover ul { + top: -999em; /* hide submenu in screen-reader and search-engine friendly way */ +} + +/* A quick note about issues with submenus appearing under Flash animations. + * Some say that setting wmode="opaque" or wmode="transparent" on the embed or + * object tag is sufficient. This does fix many issues but I find it sometimes + * helps to also add this CSS: */ +embed, object { + position: relative; + z-index: 0; +} + +/******************** ORIGINAL SKIN ******************/ +/* + * The CSS below is my attempt to extract most of the stuff you need to change in order + * to reskin the menu with the appearance you require. However, certain rules above + * (indicated with the word "VARIABLE") may also need to be altered to suit the width + * and height of your menu items and submenus. For example, if you need wider submenus + * eg: .superfish ul { width:12em} then you will need to also apply that value + * to the left offset of any deeper nested submenus, eg: + * .superfish li li:hover ul, + * ul.superfish li li.sfHover ul { + left:12em; top:-1px; + } + * + * Other than that, most of the cosmetic stuff is below: + */ + +ul.superfish { + /* if you want to change font-size, do it here as opposed to setting it on + * deeper nested anchor elements for example, so that the em unit is the + * same size for all elements in the menu + */ + float:left; /* necessary if you don't want this element to collapse */ + margin-bottom:1.5em; /* add space beneath.superfish. Purely cosmetic */ + color: white; +} +ul.superfish li { + background-color:#BDD2FF; /* default background colour */ + border-left:1px solid #fff; + border-top:1px solid #CFDEFF; + width:9.45em; + /* affects top level menu items only, as nested li elements have width 100% + * of their ul parent (see .superfish ul rules above) + */ +} +ul.superfish a { + text-decoration:none; + color:inherit; +} +DIS_ul.superfish a { + padding: .75em 0; + /* note that the top and bottom padding will affect the 'top' value (marked + * with the word "VARIABLE") of the second tier of.superfish (see + * "essential rules" above and alter accordingly) + */ + text-decoration:none; + text-indent: 2em; +} + +/* if link text runs over two or more lines, you will want padding in the + * anchor element instead of relying on text-indent to provide space. The + * following disabled rule shows how to style the submenu links in this case. + * Note that the width plus left and right padding must equal the width set + * above for the submenu (.superfish ul) + */ + +/* +.superfish ul a { + width: 7.45em; + padding: .75em 1em; + text-indent: 0; + } +*/ + +ul.superfish li:hover, +ul.superfish li.sfHover, +ul.superfish a:focus, +ul.superfish a:hover, +ul.superfish a:active { + background-color:#CFDEFF; /* hover highlight */ + background-image:url(MenuArrow.gif); + background-position:95% 85%; + background-repeat:no-repeat; +} +ul.superfish li li { + background-color:#AABDE6; /* slightly darker shade for nested submenus */ +} +ul.superfish li li li { + background-color:#9AAEDB; /* slightly darker shade for nested submenus */ +} +ul.superfish li li li li { + background-color:#707E9F; /* slightly darker shade for nested submenus */ +} +ul.superfish li.sfHover ul { + opacity:0.95; +} +ul.superfish li ul li ul li ul li, +ul.superfish li ul li ul li, +ul.superfish li ul li, +ul.superfish li { + background-image:url(MenuArrow.gif); + background-position:95% 85%; + background-repeat:no-repeat; +} +ul.superfish .sfPath { + background:red; +} Added: twiki/trunk/JQueryPlugin/pub/TWiki/JQueryPlugin/jquery.superfish.uncompressed.js =================================================================== --- twiki/trunk/JQueryPlugin/pub/TWiki/JQueryPlugin/jquery.superfish.uncompressed.js (rev 0) +++ twiki/trunk/JQueryPlugin/pub/TWiki/JQueryPlugin/jquery.superfish.uncompressed.js 2008-04-02 18:47:56 UTC (rev 16602) @@ -0,0 +1,100 @@ +/* + * Superfish v1.4.1 - jQuery menu widget + * Copyright (c) 2008 Joel Birch + * + * Dual licensed under the MIT and GPL licenses: + * http://www.opensource.org/licenses/mit-license.php + * http://www.gnu.org/licenses/gpl.html + * + * CHANGELOG: http://users.tpg.com.au/j_birch/plugins/superfish/changelog.txt + */ + +(function($){ + $.superfish = {}; + $.superfish.o = []; + $.superfish.op = {}; + $.superfish.defaults = { + hoverClass : 'sfHover', + pathClass : 'overideThisToUse', + delay : 800, + animation : {opacity:'show'}, + speed : 'normal', + oldJquery : false, /* set to true if using jQuery version below 1.2 */ + disableHI : false, /* set to true to disable hoverIntent usage */ + // callback functions: + onInit : function(){}, + onBeforeShow: function(){}, + onShow : function(){}, /* note this name changed ('onshow' to 'onShow') from version 1.4 onward */ + onHide : function(){} + }; + $.fn.superfish = function(op){ + var bcClass = 'sfbreadcrumb', + over = function(){ + var $$ = $(this), menu = getMenu($$); + getOpts(menu,true); + clearTimeout(menu.sfTimer); + $$.showSuperfishUl().siblings().hideSuperfishUl(); + }, + out = function(){ + var $$ = $(this), menu = getMenu($$); + var o = getOpts(menu,true); + clearTimeout(menu.sfTimer); + if ( !$$.is('.'+bcClass) ) { + menu.sfTimer=setTimeout(function(){ + $$.hideSuperfishUl(); + if (o.$path.length){over.call(o.$path);} + },o.delay); + } + }, + getMenu = function($el){ return $el.parents('ul.superfish:first')[0]; }, + getOpts = function(el,menuFound){ el = menuFound ? el : getMenu(el); return $.superfish.op = $.superfish.o[el.serial]; }, + hasUl = function(){ return $.superfish.op.oldJquery ? 'li[ul]' : 'li:has(ul)'; }; + + return this.each(function() { + var s = this.serial = $.superfish.o.length; + var o = $.extend({},$.superfish.defaults,op); + o.$path = $('li.'+o.pathClass,this).each(function(){ + $(this).addClass(o.hoverClass+' '+bcClass) + .filter(hasUl()).removeClass(o.pathClass); + }); + $.superfish.o[s] = $.superfish.op = o; + + $(hasUl(),this)[($.fn.hoverIntent && !o.disableHI) ? 'hoverIntent' : 'hover'](over,out) + .not('.'+bcClass) + .hideSuperfishUl(); + + var $a = $('a',this); + $a.each(function(i){ + var $li = $a.eq(i).parents('li'); + $a.eq(i).focus(function(){over.call($li);}).blur(function(){out.call($li);}); + }); + + o.onInit.call(this); + + }).addClass('superfish'); + }; + + $.fn.extend({ + hideSuperfishUl : function(){ + var o = $.superfish.op, + $ul = $('li.'+o.hoverClass,this).add(this).removeClass(o.hoverClass) + .find('>ul').hide().css('visibility','hidden'); + o.onHide.call($ul); + return this; + }, + showSuperfishUl : function(){ + var o = $.superfish.op, + $ul = this.addClass(o.hoverClass) + .find('>ul:hidden').css('visibility','visible'); + o.onBeforeShow.call($ul); + $ul.animate(o.animation,o.speed,function(){ o.onShow.call(this); }); + return this; + } + }); + + $(window).unload(function(){ + $('ul.superfish').each(function(){ + $('li',this).unbind('mouseover','mouseout','mouseenter','mouseleave'); + }); + }); +})(jQuery); Modified: twiki/trunk/JQueryPlugin/pub/TWiki/JQueryPlugin/jquery.tabpane.css =================================================================== --- twiki/trunk/JQueryPlugin/pub/TWiki/JQueryPlugin/jquery.tabpane.css 2008-03-31 18:07:06 UTC (rev 16601) +++ twiki/trunk/JQueryPlugin/pub/TWiki/JQueryPlugin/jquery.tabpane.css 2008-04-02 18:47:56 UTC (rev 16602) @@ -21,10 +21,9 @@ overflow-y:auto; } ul.jqTabGroup { - margin:0px; - padding:0px; + margin:0px !important; + padding:0px !important; height:29px; - line-height:100%; list-style:none; } ul.jqTabGroup li { @@ -36,6 +35,7 @@ padding:0px 3px 0px 0px !important; margin:0px 4px 0px 0px !important; height:29px; + line-height:100%; } ul.jqTabGroup a:active, ul.jqTabGroup a:hover, Modified: twiki/trunk/JQueryPlugin/pub/TWiki/JQueryPlugin/jquery.tabpane.js =================================================================== --- twiki/trunk/JQueryPlugin/pub/TWiki/JQueryPlugin/jquery.tabpane.js 2008-03-31 18:07:06 UTC (rev 16601) +++ twiki/trunk/JQueryPlugin/pub/TWiki/JQueryPlugin/jquery.tabpane.js 2008-04-02 18:47:56 UTC (rev 16602) @@ -32,20 +32,21 @@ var $tabGroup = $('<ul class="jqTabGroup"></ul>').prependTo($tabContainer); // get all headings and create tabs - var isFirstTab = 1; + var index = 1; var currentTabId; $(this).children(".jqTab").each(function() { var title = $('h2', this).eq(0).remove().text(); - $tabGroup.append('<li'+(isFirstTab?' class="current"':'')+'><a href="javascript:void(0)" data="'+this.id+'">'+title+'</a></li>'); - if (isFirstTab) { - isFirstTab = 0; + $tabGroup.append('<li'+(index == opts.select?' class="current"':'')+'><a href="javascript:void(0)" data="'+this.id+'">'+title+'</a></li>'); + if (index == opts.select) { currentTabId = this.id; $(this).addClass("current"); } else { writeDebug("hiding "+this.id); $(this).removeClass("current"); } + index++; }); + //$tabGroup.append('<br class="twikiClear" />'); $(".jqTabGroup li > a", this).click(function() { $(this).blur(); var newTabId = $(this).attr('data'); @@ -58,7 +59,7 @@ // before click handler if (typeof(data.beforeHandler) != "undefined") { - var command = "{ var oldTab = '"+currentTabId+"'; var newTab = '"+newTabId+"'; "+data.beforeHandler+";}"; + var command = "{ oldTab = '"+currentTabId+"'; newTab = '"+newTabId+"'; "+data.beforeHandler+";}"; writeDebug("exec "+command); //eval(command); } @@ -71,7 +72,7 @@ // after click handler if (typeof(data.afterHandler) != "undefined") { - var command = "{ var oldTab = '"+currentTabId+"'; var newTab = '"+newTabId+"'; "+data.afterHandler+";}"; + var command = "{ oldTab = '"+currentTabId+"'; newTab = '"+newTabId+"'; "+data.afterHandler+";}"; writeDebug("exec "+command); eval(command); } @@ -101,6 +102,7 @@ * plugin defaults */ $.fn.tabpane.defaults = { - debug: false + debug: false, + select: 1 }; })(jQuery); |