我正在将Drupal 6主题转换为Drupal 7,并且无法将此部分转换出来。我有以下HTML:如何自动调整此HTML菜单的大小以适应父宽度?
在Drupal的6这个主题是使用jQuery V1.3.2,但在Drupal 7的jQuery 1.4.4是内置的,所以功能似乎并不奏效。下面是jQuery函数:
$(function(){
clearFormFields({
clearInputs: true,
clearTextareas: false,
passwordFieldText: true,
addClassFocus: "focus",
filterClass: "form-text"
});
initAutoScalingNav({
menuId: "nav",
sideClasses: true
});
ieHover('#nav li');
$('div.gallery-block').fadeGallery({
slideElements:'ul.gallery > li',
pagerLinks:'ul.switcher li'
});
$('div.pictures-box').fadeGallery({
slideElements:'ul.fade-gallery > li',
pagerLinks:'ul.pictures-list li',
title: true
});
});
function initAutoScalingNav(o) {
if (!o.menuId) o.menuId = "nav";
if (!o.tag) o.tag = "a";
if (!o.spacing) o.spacing = 0;
if (!o.constant) o.constant = 0;
if (!o.minPaddings) o.minPaddings = 0;
if (!o.liHovering) o.liHovering = false;
if (!o.sideClasses) o.sideClasses = false;
if (!o.equalLinks) o.equalLinks = false;
if (!o.flexible) o.flexible = false;
var nav = document.getElementById(o.menuId);
if(nav) {
nav.className += " scaling-active";
var lis = nav.getElementsByTagName("li");
var asFl = [];
var lisFl = [];
var width = 0;
for (var i=0, j=0; i
if(lis[i].parentNode == nav) {
var t = lis[i].getElementsByTagName(o.tag).item(0);
asFl.push(t);
asFl[j++].width = t.offsetWidth;
lisFl.push(lis[i]);
if(width < t.offsetWidth) width = t.offsetWidth;
}
if(o.liHovering) {
lis[i].onmouseover = function() {
this.className += " hover";
}
lis[i].onmouseout = function() {
this.className = this.className.replace("hover", "");
}
}
}
var menuWidth = nav.clientWidth - asFl.length*o.spacing - o.constant;
if(o.equalLinks && width * asFl.length < menuWidth) {
for (var i=0; i
asFl[i].width = width;
}
}
width = getItemsWidth(asFl);
if(width < menuWidth) {
var version = navigator.userAgent.toLowerCase();
for (var i=0; getItemsWidth(asFl) < menuWidth; i++) {
asFl[i].width++;
if(!o.flexible) {
asFl[i].style.width = asFl[i].width + "px";
}
if(i >= asFl.length-1) i=-1;
}
if(o.flexible) {
for (var i=0; i
width = (asFl[i].width - o.spacing - o.constant/asFl.length)/menuWidth*100;
if(i != asFl.length-1) {
lisFl[i].style.width = width + "%";
}
else {
if(navigator.appName.indexOf("Microsoft Internet Explorer") == -1 || version.indexOf("msie 8") != -1 || version.indexOf("msie 9") != -1)
lisFl[i].style.width = width + "%";
}
}
}
}
else if(o.minPaddings > 0) {
for (var i=0; i
asFl[i].style.paddingLeft = o.minPaddings + "px";
asFl[i].style.paddingRight = o.minPaddings + "px";
}
}
if(o.sideClasses) {
lisFl[0].className += " first-child";
lisFl[0].getElementsByTagName(o.tag).item(0).className += " first-child-a";
lisFl[lisFl.length-1].className += " last-child";
lisFl[lisFl.length-1].getElementsByTagName(o.tag).item(0).className += " last-child-a";
}
nav.className += " scaling-ready";
}
function getItemsWidth(a) {
var w = 0;
for(var q=0; q
w += a[q].width;
}
return w;
}
}
在Drupal的版本6上面的代码自动添加风格=“宽度:XX”标记的超链接,这使得菜单中生长的菜单按钮,以填补的宽度它的容器。
谢谢。
+1
我看到一个使用jQuery的零相关代码,除了( )(文件准备简写)。 –
2011-03-02 04:05:14