added drop menu

This commit is contained in:
Roland Gruber 2010-12-03 21:06:08 +00:00
parent c324b6f46b
commit b7b9dd3494
3 changed files with 237 additions and 1 deletions

View File

@ -143,5 +143,5 @@ main license and authors:
lib/fpdf.php A 2008 Olivier Plathey lib/fpdf.php A 2008 Olivier Plathey
lib/font/Vera* B 2003 Bitstream, Inc. lib/font/Vera* B 2003 Bitstream, Inc.
templates/lib/wz_tooltip.js C Walter Zorn templates/lib/wz_tooltip.js C Walter Zorn
templates/lib/jquery*.js D 2010 John Resig, 2010 Paul Bakaus templates/lib/jquery*.js D 2010 John Resig, Paul Bakaus, Fred Heusschen
lib/3rdParty/phpseclib C Jim Wigginton lib/3rdParty/phpseclib C Jim Wigginton

View File

@ -0,0 +1,32 @@
/* ---------------------------------------------------------
Essentials
*/
.dropmenu {
margin: 0;
padding: 0;
height: 30px;
}
/* All items */
.dropmenu li a {
text-decoration: none;
}
.dropmenu li a,
.dropmenu li span {
padding: 9px;
text-align: left;
}
.dropmenu .sublevel {
background: #E6E6E6 url(images/ui-bg_glass_75_e6e6e6_1x400.png) repeat-x scroll 50% 50%;
border-bottom: 1px solid #888;
border-right: 1px solid #888;
border-left: 1px solid #888;
}
.dropmenu .sublevel.hover {
background: #E6E6E6 url(images/ui-bg_glass_75_dadada_1x400.png) repeat-x scroll 50% 50%;
}

View File

@ -0,0 +1,204 @@
/*
* jQuery dropmenu 1.1.3
* www.frebsite.nl
* Copyright (c) 2010 Fred Heusschen
* Licensed under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
*/
(function($) {
$.fn.dropmenu = function(options) {
var isIE = $.browser.ie,
isIE6 = isIE && $.browser.version < 7,
isIE7 = isIE && $.browser.version < 8;
return this.each(function() {
var opts = $.extend({}, $.fn.dropmenu.defaults, options),
$menu = $(this),
$topl = $menu.find('> li'),
menuX = $menu.offset().left;
if (opts.maxWidth == 0) {
opts.maxWidth = $('body').width() - menuX;
}
// UL itself and all LI's
$menu
.css({
display : 'block',
listStyle : 'none'
})
.find("li")
.css({
display : 'block',
listStyle : 'none',
position : 'relative',
margin : 0,
padding : 0
});
var css = {
display : 'block',
outline : 'none'
};
if (opts.nbsp) css['whiteSpace'] = 'nowrap';
// all A's and SPANs
$menu
.find('li > a, li > span')
.css(css);
// top-level LI's and top level A's and SPANs
$topl
.css({
float : 'right'
})
.find('> a, > span')
.addClass('toplevel')
.css({
float : 'right'
});
// all sub-ULs
$menu
.find('ul')
.css({
display : 'none',
position : 'absolute',
margin : 0,
padding : 0
});
// first sub-UL and second, third, etc. sub-ULs
$topl
.find('> ul')
.css({
left : 0,
top : $topl.outerHeight()
})
.find('li > a, li > span')
.addClass('sublevel')
.parent()
.find('ul')
.css({
top : 0
}).data('subsub', true);
$topl
// IE fixes
if (isIE6) {
$menu.find('ul').css({
lineHeight : 0
});
}
if (isIE6 || isIE7) {
$menu.find('ul a, ul span').css({
zoom : 1
});
}
$menu.find('a').click(function() {
$('ul', $menu).hide();
$('a, span', $menu).removeClass('hover');
});
$menu.find('li').hover(
// showing submenu
function() {
var listit = this,
subnav = $.fn.dropmenu.getSubnav(listit),
subcss = { zIndex: $.fn.dropmenu.zIndex++ };
$(listit).find('> a, > span').addClass('hover');
if (!subnav) return;
if ($(subnav).is(":animated")) return;
if ($.data(subnav, 'subsub')) {
var distance = $(listit).outerWidth(),
itemWidth = $(listit).offset().left + distance - menuX,
position = (opts.maxWidth < itemWidth) ? "right" : "left";
subcss[position] = distance;
}
$(subnav).css(subcss);
$.data(subnav, 'stayOpen', true);
switch (opts.effect) {
case 'slide':
$(subnav).slideDown(opts.speed);
break;
case 'fade':
$(subnav).fadeIn(opts.speed);
break;
default:
$(subnav).show();
break;
}
// hiding submenu
}, function() {
var listit = this,
subnav = $.fn.dropmenu.getSubnav(listit);
if (!subnav) {
$(listit).find('> a, > span').removeClass('hover');
return;
}
$.data(subnav, 'stayOpen', false);
setTimeout(function() {
if ($.data(subnav, 'stayOpen')) return;
$(listit).find('> a, > span').removeClass('hover');
$('ul', subnav).hide();
switch (opts.effect) {
case 'slide':
$(subnav).slideUp(opts.speed);
break;
case 'fade':
$(subnav).fadeOut(opts.speed);
break;
default:
$(subnav).hide();
break;
}
}, opts.timeout);
}
);
});
};
$.fn.dropmenu.getSubnav = function(ele) {
if (ele.nodeName.toLowerCase() == 'li') {
var subnav = $('> ul', ele);
return subnav.length ? subnav[0] : null;
} else {
return ele;
}
}
$.fn.dropmenu.zIndex = 1000;
$.fn.dropmenu.defaults = {
effect : 'none', // 'slide', 'fade', or 'none'
speed : 'normal', // 'normal', 'fast', 'slow', 100, 1000, etc
timeout : 250,
nbsp : false,
maxWidth : 0
};
})(jQuery);