Новичок
Профиль
Группа: Участник
Сообщений: 12
Регистрация: 17.9.2005
Репутация: нет
Всего: нет
|
Ниже приведен скрипт, который создает древовидное меню. Вопрос: 1. Как сделать, чтобы ссылки открывались в родительском окне? 2. Как сделать, чтобы при наведении на все ссылки отображался hend? | Код |
/**********************************
Глобальные переменные
***********************************/
// предв. кеширование картинок
// (все картинки должны иметь одинаковые высоту и ширину)
var collapsedWidget = new Image(20, 16);
collapsedWidget.src = "var/oplus.gif";
var collapsedWidgetStart = new Image(20, 16);
collapsedWidgetStart.src = "var/oplusStart.gif";
var collapsedWidgetEnd = new Image(20, 16);
collapsedWidgetEnd.src = "var/oplusEnd.gif";
var expandedWidget = new Image(20, 16);
expandedWidget.src = "var/ominus.gif";
var expandedWidgetStart = new Image(20, 16);
expandedWidgetStart.src = "var/ominusStart.gif";
var expandedWidgetEnd = new Image(20, 16);
expandedWidgetEnd.src = "var/ominusEnd.gif";
var nodeWidget = new Image(20, 16);
nodeWidget.src = "var/onode.gif";
var nodeWidgetEnd = new Image(20, 16);
nodeWidgetEnd.src = "var/onodeEnd.gif";
var emptySpace = new Image(20, 16);
emptySpace.src = "var/oempty.gif";
var chainSpace = new Image(20, 16);
chainSpace.src = "var/ochain.gif";
// разные переменные
var widgetWidth = "20";
var widgetHeight = "16";
var currState = "";
var displayTarget = "Main";
/**********************************
МЕНЮ
***********************************/
var expansionState = "";
// constructor for outline item objects
function outlineItem(text, uri) {
this.text = text;
this.uri = uri;
}
var olData = {childNodes:
[{item:new outlineItem("Россия и СНГ"),
childNodes:
[{item:new outlineItem("Оренбург", "http://aliance.hoha.ru/")},
{item:new outlineItem("Башкирия", "http://aliance.hoha.ru/")},
{item:new outlineItem("Челябинск", "http://aliance.hoha.ru/")},
{item:new outlineItem("Самара", "http://aliance.hoha.ru/")},
{item:new outlineItem("Москва, подмосковье", "http://aliance.hoha.ru/")},
{item:new outlineItem("Черноморское побережье Кавказа", "http://aliance.hoha.ru/"),
childNodes:
[{item:new outlineItem("Сочи", "http://aliance.hoha.ru/")},
{item:new outlineItem("Анапа", "http://aliance.hoha.ru/")},
{item:new outlineItem("Геленджик", "http://aliance.hoha.ru/")},
{item:new outlineItem("Туапсе", "http://aliance.hoha.ru/")},
{item:new outlineItem("Адлер", "http://aliance.hoha.ru/")}
]},
{item:new outlineItem("Абхазия", "http://aliance.hoha.ru/")},
{item:new outlineItem("Кавказмкие минеральные воды", "http://aliance.hoha.ru/"),
childNodes:
[{item:new outlineItem("Кисловодск", "http://aliance.hoha.ru/")},
{item:new outlineItem("Пятигорск", "http://aliance.hoha.ru/")},
{item:new outlineItem("Есентуки", "http://aliance.hoha.ru/")},
{item:new outlineItem("Железноводск", "http://aliance.hoha.ru/")}
]},
{item:new outlineItem("Крым", "http://aliance.hoha.ru/"),
childNodes:
[{item:new outlineItem("Южный берег", "http://aliance.hoha.ru/")},
{item:new outlineItem("Западный берег", "http://aliance.hoha.ru/")},
{item:new outlineItem("Восточный берег", "http://aliance.hoha.ru/")}
]},
{item:new outlineItem("Трускавец", "http://aliance.hoha.ru/")},
{item:new outlineItem("Экскурсионные туры", "http://aliance.hoha.ru/")},
{item:new outlineItem("Речные круизы по Волге", "http://aliance.hoha.ru/")}
]},
{item:new outlineItem("Заграничные туры"),
childNodes:
[{item:new outlineItem("Австралия", "http://aliance.hoha.ru/")},
{item:new outlineItem("Канада", "http://aliance.hoha.ru/")},
{item:new outlineItem(" и т.д. ", "http://aliance.hoha.ru/")}
]}
]
};
/**********************************
Управление видимостью и картинками
***********************************/
function swapState(currState, currVal, n) {
var newState = currState.substring(0,n);
newState += currVal ^ 1 // Bitwise XOR item n;
newState += currState.substring(n+1,currState.length);
return newState;
}
function getExpandedWidgetState(imgURL) {
if (imgURL.indexOf("Start") != -1) {
return expandedWidgetStart.src;
}
if (imgURL.indexOf("End") != -1) {
return expandedWidgetEnd.src;
}
return expandedWidget.src;
}
function getCollapsedWidgetState(imgURL) {
if (imgURL.indexOf("Start") != -1) {
return collapsedWidgetStart.src;
}
if (imgURL.indexOf("End") != -1) {
return collapsedWidgetEnd.src;
}
return collapsedWidget.src;
}
function toggle(img, blockNum) {
var newString = "";
var expanded, n;
expanded = currState.charAt(blockNum);
currState = swapState(currState, expanded, blockNum);
if (expanded == "0") {
document.getElementById("OLBlock" + blockNum).style.display = "block";
img.src = getExpandedWidgetState(img.src);
} else {
document.getElementById("OLBlock" + blockNum).style.display = "none";
img.src = getCollapsedWidgetState(img.src);
}
}
function expandAll() {
var newState = "";
while (newState.length < currState.length) {
newState += "1";
}
currState = newState;
initExpand();
}
function collapseAll() {
var newState = "";
while (newState.length < currState.length) {
newState += "0";
}
currState = newState;
initExpand();
}
/*********************************
Генерация кода HTML
**********************************/
function calcBlockState(n) {
var expandedData = (expansionState.length > 0) ? expansionState.split(",") : null;
if (expandedData) {
for (var j = 0; j < expandedData.length; j++) {
if (n == expandedData[j] - 1) {
return "1";
}
}
}
return "0";
}
var currID = 0;
var blockID = 0;
function drawOutline(ol, prefix) {
var output = "";
var nestCount, link, nestPrefix, lastInnerNode;
prefix = (prefix) ? prefix : "";
for (var i = 0; i < ol.childNodes.length ; i++) {
nestCount = (ol.childNodes[i].childNodes) ? ol.childNodes[i].childNodes.length : 0;
output += "<div class='OLRow' id='line" + currID++ + "'>\n";
if (nestCount > 0) {
output += prefix;
output += "<img id='widget" + (currID-1) + "' src='" + ((i == ol.childNodes.length-1 && blockID != 0) ? collapsedWidgetEnd.src : (blockID == 0) ? collapsedWidgetStart.src : collapsedWidget.src);
output += "' height=" + widgetHeight + " width=" + widgetWidth;
output += " title='Click to expand/collapse nested items.' onClick='toggle(this," + blockID + ")'> ";
link = (ol.childNodes[i].item.uri) ? ol.childNodes[i].item.uri : "";
if (link) {
output += "<a style='cursor: hand' href='" + link + "' class='itemTitle' title='" +
link + "' target='" + displayTarget + "'>" ;
} else {
output += "<a style='cursor: hand' class='itemTitle' title='" + link + "'>";
}
output += "<span style='position:relative; top:-3px; height:11px'>" + ol.childNodes[i].item.text + "</span></a>";
currState += calcBlockState(currID-1);
output += "<span class='OLBlock' blocknum='" + blockID + "' id='OLBlock" + blockID++ + "'>";
nestPrefix = prefix;
nestPrefix += (i == ol.childNodes.length - 1) ?
"<img src='" + emptySpace.src + "' height=" + widgetHeight + " width=" + widgetWidth + ">" :
"<img src='" + chainSpace.src + "' height=" + widgetHeight + " width=" + widgetWidth + ">"
output += drawOutline(ol.childNodes[i], nestPrefix);
output += "</span></div>\n";
} else {
output += prefix;
output += "<img id='widget" + (currID-1) + "' src='" + ((i == ol.childNodes.length - 1) ? nodeWidgetEnd.src : nodeWidget.src);
output += "' height=" + widgetHeight + " width=" + widgetWidth + ">";
link = (ol.childNodes[i].item.uri) ? ol.childNodes[i].item.uri : "";
if (link) {
output += " <a href='" + link + "' class='itemTitle' title='" +
link + "' target='" + displayTarget + "'>";
} else {
output += " <a style='cursor: hand' class='itemTitle' title='" + link + "'>";
}
output += "<span style='position:relative; top:-3px; height:11px'>" + ol.childNodes[i].item.text + "</span></a>";
output += "</div>\n";
}
}
return output;
}
/*********************************
Инициализация
**********************************/
function initExpand() {
for (var i = 0; i < currState.length; i++) {
if (currState.charAt(i) == 1) {
document.getElementById("OLBlock" + i).style.display = "block";
} else {
document.getElementById("OLBlock" + i).style.display = "none";
}
}
}
function initExpMenu(xFile) {
// заворачиваем все меню в span
var olHTML = "<span id='renderedOL'>" + drawOutline(olData) + "</span>";
// закидываем код HTML в 'content' div для отображения
document.getElementById("content").innerHTML = olHTML;
initExpand();
} |
|
Открытие ссылки в родительском окне 
Загрузка ...
