Neler yeni

Yeni mesajlar Yeni konular En çok mesaj En çok tepki En çok görüntülenen

Menü sorunu lütfen yardım edin...

D

DorlioN26

🏅Acemi Tasarımcı🏅
Katılım
5 Mar 2011
Mesajlar
27
Tepkime puanı
0
Merhaba arkadaşlar internette bulduğum menü kodlarını dw da çalıştırmaya çalışıyorum ama aynı sonucu alamıyorum. Lütfen acil yardım :(

Yapmak istediğim menü linki: https://www.456bereastreet.com/lab/accessible-expanding-collapsing-menu/

Kodlar:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "https://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="https://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style>
// JavaScript Document
var toggleMenu = {
init : function(sContainerClass, sHiddenClass) {
if (!document.getElementById || !document.createTextNode) {return;} // Check for DOM support
var arrMenus = this.getElementsByClassName(document, 'ul', sContainerClass); // Find all menus
var arrSubMenus, oSubMenu, oLink;
for (var i = 0; i < arrMenus.length; i++) { // In each menu...
arrSubMenus = arrMenus.getElementsByTagName('ul'); // ...find all sub menus
for (var j = 0; j < arrSubMenus.length; j++) { // For each sub menu...
oSubMenu = arrSubMenus[j];
oLink = oSubMenu.parentNode.getElementsByTagName('a')[0]; // ...find the link that toggles it...
oLink.onclick = function(){toggleMenu.toggle(this.parentNode.getElementsByTagName('ul')[0], sHiddenClass); return false;} // ... add an event handler to the link...
this.toggle(oSubMenu, sHiddenClass); // ... and hide the sub menu
}
}
},
toggle : function(el, sHiddenClass) {
var oRegExp = new RegExp("(^|\\s)" + sHiddenClass + "(\\s|$)");
el.className = (oRegExp.test(el.className)) ? el.className.replace(oRegExp, '') : el.className + ' ' + sHiddenClass; // Add or remove the class name that hides the element
},
/* addEvent and getElementsByClassName functions omitted for brevity */
}
// Initialise the menu
toggleMenu.addEvent(window, 'load', function(){toggleMenu.init('menu','hidden');});

/*CSS */
.menu,
.menu ul {
margin:0;
padding:0;
list-style:none;
}
.menu {width:150px;}
.menu li {
margin:0;
padding:0;
margin-bottom:1px;
}
.menu a {
display:block;
padding:2px 5px;
color:#000;
background: #216BC7;
text-decoration:none;
}
.menu a:hover {background: #4584CF}
.menu ul li {padding-left:15px;}
.menu ul a {background: #78C2EB}
.hidden {display:none;}
</style>
</head>

<body>
<ul class="menu">
<li><a href="#">Category 1</a>
<ul>
<li><a href="#">Submenu 1a</a></li>
<li><a href="#">Submenu 1b</a></li>
</ul>
</li>
<li><a href="#">Category 2</a>
<ul>
<li><a href="#">Submenu 2a</a></li>
<li><a href="#">Submenu 2b</a></li>
</ul>
</li>
<li><a href="#">Category 3</a>
<ul>
<li><a href="#">Submenu 3a</a></li>
<li><a href="#">Submenu 3b</a></li>
</ul>
</li>
</ul>
</body>
</html>
 
Benzer konular Forum Tarih
A Lapazz H640 Menu Açılma Sorunu Grafik Tabletler ile ilgili soru ve sorunlarınız. 1 1K
neronkadir Flash Tema Menü Buton Link Sorunu Flash 4 818
U Corel Draw X5 (menü sorunu) Corel Draw 1 1K
coldnodia AI Opacity Menü Sorunu Illustrator Soru ve Sorunlarınız 2 726
KanserTango Freehand Tool & Menü Bar Sorunu Freehand 2 2K
EmreCandar Wp Üst Menü Sorunu Yardım. Web Tasarımı 2 1K
O dikey menü sorunu Dreamweaver 1 1K
W Flash Website Menu Sorunu ? Flash 0 1K

Benzer konular

D

DorlioN26

🏅Acemi Tasarımcı🏅
Katılım
5 Mar 2011
Mesajlar
27
Tepkime puanı
0
Arkadaşlar kodlarda mı hata var? acil yardıma ihtiyacım var lütfen.... :(
 
Y

yasadisigenc

🌱Yeni Üye🌱
Katılım
16 Ara 2009
Mesajlar
2
Tepkime puanı
0
biraz geç oldu ama idare et artık :)

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "https://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="https://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script language="javascript">
var toggleMenu = {
init : function(sContainerClass, sHiddenClass) {
if (!document.getElementById || !document.createTextNode) {return;} // Check for DOM support
var arrMenus = this.getElementsByClassName(document, 'ul', sContainerClass);
var arrSubMenus, oSubMenu, oLink;
for (var i = 0; i < arrMenus.length; i++) {
arrSubMenus = arrMenus.getElementsByTagName('ul');
for (var j = 0; j < arrSubMenus.length; j++) {
oSubMenu = arrSubMenus[j];
oLink = oSubMenu.parentNode.getElementsByTagName('a')[0];
oLink.onclick = function(){toggleMenu.toggle(this.parentNode.getElementsByTagName('ul')[0], sHiddenClass); return false;}
this.toggle(oSubMenu, sHiddenClass);
}
}
},
toggle : function(el, sHiddenClass) {
var oRegExp = new RegExp("(^|\\s)" + sHiddenClass + "(\\s|$)");
el.className = (oRegExp.test(el.className)) ? el.className.replace(oRegExp, '') : el.className + ' ' + sHiddenClass; // Add or remove the class name that hides the element
},
/* addEvent function from ... and the winner is ... - QuirksBlog */
addEvent : function(obj, type, fn) {
if (obj.addEventListener)
obj.addEventListener(type, fn, false);
else if (obj.attachEvent) {
obj["e"+type+fn] = fn;
obj[type+fn] = function() {obj["e"+type+fn](window.event);}
obj.attachEvent("on"+type, obj[type+fn]);
}
},
/*
Written by Jonathan Snook, Snook.ca: Tips, Tricks and Bookmarks on Web Development.
Add-ons by Robert Nyman, Robert's talk
*/
getElementsByClassName : function(oElm, strTagName, strClassName){
var arrElements = (strTagName == "*" && document.all)? document.all : oElm.getElementsByTagName(strTagName);
var arrReturnElements = new Array();
strClassName = strClassName.replace(/\-/g, "\\-");
var oRegExp = new RegExp("(^|\\s)" + strClassName + "(\\s|$)");
var oElement;
for(var i=0; i<arrElements.length; i++){
oElement = arrElements;
if(oRegExp.test(oElement.className)){
arrReturnElements.push(oElement);
}
}
return (arrReturnElements)
}
};
toggleMenu.addEvent(window, 'load', function(){toggleMenu.init('menu','hidden');});

</script>
<style>
/*CSS */
.menu,
.menu ul {
margin:0;
padding:0;
list-style:none;
}
.menu {width:150px;}
.menu li {
margin:0;
padding:0;
margin-bottom:1px;
}
.menu a {
display:block;
padding:2px 5px;
color:#000;
background: #216BC7;
text-decoration:none;
}
.menu a:hover {background: #4584CF}
.menu ul li {padding-left:15px;}
.menu ul a {background: #78C2EB}
.hidden {display:none;}
</style>
</head>

<body>
<ul class="menu">
<li><a href="#">Category 1</a>
<ul>
<li><a href="#">Submenu 1a</a></li>
<li><a href="#">Submenu 1b</a></li>
</ul>
</li>
<li><a href="#">Category 2</a>
<ul>
<li><a href="#">Submenu 2a</a></li>
<li><a href="#">Submenu 2b</a></li>
</ul>
</li>
<li><a href="#">Category 3</a>
<ul>
<li><a href="#">Submenu 3a</a></li>
<li><a href="#">Submenu 3b</a></li>
</ul>
</li>
</ul>
</body>
</html>
 
Cevap yazmak için giriş yap yada kayıt ol.
Üst