Моля за малко помощ с падщо меню

M

Melanholly

Registered
Та мъча се да таправя един сайт и не ми се отзава много :D ето това е той пробвах с няколко урока тука от сайта но нищо не помага ще може ли някой да ми помогне да направя падащо менюто без да ми се размества нищо :D благодаря предварително :)
 
вариант1
Код: 
<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">

<title>Яко меню</title>

<style type="text/css">

#dropmenudiv{
position:absolute;
border:1px solid black;
border-bottom-width: 0;
font:normal 12px Verdana;
line-height:18px;
z-index:100;
}

#dropmenudiv a{
width: 100%;
display: block;
text-indent: 3px;
border-bottom: 1px solid black;
padding: 1px 0;
text-decoration: none;
font-weight: bold;
}

#dropmenudiv a:hover{ /*hover background color*/
background-color: yellow;
}

</style>

<script type="text/javascript">

// Kaкво съдържа първото падащо меню :
var menu1=new Array()
menu1[0]='<a href="линк1">Линк 1</a>'
menu1[1]='<a href="линк2">Линк 2</a>'
menu1[2]='<a href="линк3">линк3</a>'
menu1[3]='<a href="линк4">линк4</a>'

// Съдържание на падащото меню от списъка :
var menu2=new Array()
menu2[0]='<a href="линк1">Линк 1 от втори бутон</a>'
menu2[1]='<a href="линк2">Линк 2 от втори бутон</a>'
menu2[2]='<a href="линк3">Линк 3 от втори бутон</a>'

var menuwidth='165px'
var menubgcolor='lightyellow' 
var disappeardelay=250
var hidemenu_onclick="yes"


var ie4=document.all
var ns6=document.getElementById&&!document.all

if (ie4||ns6)
document.write('<div id="dropmenudiv" style="visibility:hidden;width:'+menuwidth+';background-color:'+menubgcolor+'" onMouseover="clearhidemenu()" onMouseout="dynamichide(event)"></div>')

function getposOffset(what, offsettype){
var totaloffset=(offsettype=="left")? what.offsetLeft : what.offsetTop;
var parentEl=what.offsetParent;
while (parentEl!=null){
totaloffset=(offsettype=="left")? totaloffset+parentEl.offsetLeft : totaloffset+parentEl.offsetTop;
parentEl=parentEl.offsetParent;
}
return totaloffset;
}


function showhide(obj, e, visible, hidden, menuwidth){
if (ie4||ns6)
dropmenuobj.style.left=dropmenuobj.style.top="-500px"
if (menuwidth!=""){
dropmenuobj.widthobj=dropmenuobj.style
dropmenuobj.widthobj.width=menuwidth
}
if (e.type=="click" && obj.visibility==hidden || e.type=="mouseover")
obj.visibility=visible
else if (e.type=="click")
obj.visibility=hidden
}

function iecompattest(){
return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
}

function clearbrowseredge(obj, whichedge){
var edgeoffset=0
if (whichedge=="rightedge"){
var windowedge=ie4 && !window.opera? iecompattest().scrollLeft+iecompattest().clientWidth-15 : window.pageXOffset+window.innerWidth-15
dropmenuobj.contentmeasure=dropmenuobj.offsetWidth
if (windowedge-dropmenuobj.x < dropmenuobj.contentmeasure)
edgeoffset=dropmenuobj.contentmeasure-obj.offsetWidth
}
else{
var topedge=ie4 && !window.opera? iecompattest().scrollTop : window.pageYOffset
var windowedge=ie4 && !window.opera? iecompattest().scrollTop+iecompattest().clientHeight-15 : window.pageYOffset+window.innerHeight-18
dropmenuobj.contentmeasure=dropmenuobj.offsetHeight
if (windowedge-dropmenuobj.y < dropmenuobj.contentmeasure){ //move up?
edgeoffset=dropmenuobj.contentmeasure+obj.offsetHeight
if ((dropmenuobj.y-topedge)<dropmenuobj.contentmeasure) //up no good either?
edgeoffset=dropmenuobj.y+obj.offsetHeight-topedge
}
}
return edgeoffset
}

function populatemenu(what){
if (ie4||ns6)
dropmenuobj.innerHTML=what.join("")
}


function dropdownmenu(obj, e, menucontents, menuwidth){
if (window.event) event.cancelBubble=true
else if (e.stopPropagation) e.stopPropagation()
clearhidemenu()
dropmenuobj=document.getElementById? document.getElementById("dropmenudiv") : dropmenudiv
populatemenu(menucontents)

if (ie4||ns6){
showhide(dropmenuobj.style, e, "visible", "hidden", menuwidth)
dropmenuobj.x=getposOffset(obj, "left")
dropmenuobj.y=getposOffset(obj, "top")
dropmenuobj.style.left=dropmenuobj.x-clearbrowseredge(obj, "rightedge")+"px"
dropmenuobj.style.top=dropmenuobj.y-clearbrowseredge(obj, "bottomedge")+obj.offsetHeight+"px"
}

return clickreturnvalue()
}

function clickreturnvalue(){
if (ie4||ns6) return false
else return true
}

function contains_ns6(a, b) {
while (b.parentNode)
if ((b = b.parentNode) == a)
return true;
return false;
}

function dynamichide(e){
if (ie4&&!dropmenuobj.contains(e.toElement))
delayhidemenu()
else if (ns6&&e.currentTarget!= e.relatedTarget&& !contains_ns6(e.currentTarget, e.relatedTarget))
delayhidemenu()
}

function hidemenu(e){
if (typeof dropmenuobj!="undefined"){
if (ie4||ns6)
dropmenuobj.style.visibility="hidden"
}
}

function delayhidemenu(){
if (ie4||ns6)
delayhide=setTimeout("hidemenu()",disappeardelay)
}

function clearhidemenu(){
if (typeof delayhide!="undefined")
clearTimeout(delayhide)
}

if (hidemenu_onclick=="yes")
document.onclick=hidemenu

</script> 

</head>

<body>

<a href="Меню1" onClick="return clickreturnvalue()" onMouseover="dropdownmenu(this, event, menu1, '150px')" onMouseout="delayhidemenu()">Падащо меню 1</a> |

<a href="Меню2" onClick="return dropdownmenu(this, event, menu2, '200px')" onMouseout="delayhidemenu()">Падащо меню 2</a>

</body>

</html>
вариант2
Код: 
<html> 
<head> 
<title>Уроци за уеб програмиране</title> 
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251"> 
<script type="text/javascript"> 
//С тази функция запазваме бисквитка 
function setCookie(name, value, expires, path, domain, secure) { 
document.cookie = name + "=" + escape(value) + 
((expires == null) ? "" : "; expires=" + expires.toGMTString()) + 
((path == null) ? "" : "; path=" + path) + 
((domain == null) ? "" : "; domain=" + domain) + 
((secure == null) ? "" : "; secure"); 
} 
//С тази функция четеме бисквитките 
function readCookie(name) { 
var nameEQ = name + "="; 
var ca = document.cookie.split(';'); 
for(var i=0;i < ca.length;i++) { 
var c = ca[i]; 
while (c.charAt(0)==' ') c = c.substring(1,c.length); 
if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length); 
} 
return null; 
} 
//функцията за отваряне и затваряне на менютата 
function menuop(id) 
{ 
var x = document.getElementById('menu'+id); //викаме определеното id за менюто 
if(x.style.display == "block") //проверяваме дали е block 
{ resu = "none"; } //връща като резултат none 
else 
{ resu = "block"; } //връща като резултат block 
x.style.display = resu; 
setCookie('menu'+id,resu); 
} 
//тази функция проверява дали има бисквитка записана с резултат за менюто 
function openclosemenu(name) 
{ 
obj = document.getElementById(name); 
if(readCookie(name)) 
{ 
obj.style.display = readCookie(name); 
} 
} 
//Функция която визуализира менюто според това кое сте избрали да е отворено или затворено 
window.onload = function() 
{ 
for(i=0;i<document.all.tags('ul').length;i++) 
{ 
name=document.all.tags('ul')[i].id; 
openclosemenu(name); 
} 
} 
</script> 
<style type="text/css"> 
ul 
{ 
width: 160px; /* ширина */ 
list-style: none; /* казваме на списака да няма никакъв стил , обикновенно е с точка пред всеки елемент*/ 
margin: 0px; /* премагваме мерджина не ни трябва тук*/ 
display: none; /* казваме на списака да не се показва*/ 
border: 1px solid #3366FF; 
} 

.topmenu 
{ 
width: 160px; /* ширина */ 
height: 20px; /* височина */ 
cursor: hand; /* изглед на курсора */ 
border: 1px solid #3366FF; /* цвят на бордера */ 
color: #FFFF99; /* цвят на шрифта */ 
background: #3399FF; /* цвят на задния фон */ 
} 

#menu a 
{ 
text-decoration: none; /* без декорация на текста */ 
color: #FF3300; /* цвят на шрифта */ 
} 

#menu a:hover 
{ 
text-decoration: none; /* без декорация на текста */ 
color: #990000; /* цвят на шрифта */ 
} 
</style> 
</head> 
</body> 

<div id="menu"> 
<div class="topmenu" onclick="menuop('1')">Menu 1</div> 
<ul id="menu1"> 
<li><a href="#">link1</a></li> 
<li><a href="#">link2</a></li> 
<li><a href="#">link3</a></li> 
<li><a href="#">link4</a></li> 
</ul> 
<div class="topmenu" onclick="menuop('2')">Menu 2</div> 
<ul id="menu2"> 
<li><a href="#">link1</a></li> 
<li><a href="#">link2</a></li> 
<li><a href="#">link3</a></li> 
</ul> 
<div class="topmenu" onclick="menuop('3')">Menu 3</div> 
<ul id="menu3"> 
<li><a href="#">link1</a></li> 
<li><a href="#">link2</a></li> 
<li><a href="#">link3</a></li> 
<li><a href="#">link4</a></li> 
<li><a href="#">link5</a></li> 
<li><a href="#">link6</a></li> 
<li><a href="#">link7</a></li> 
</ul> 
</div> 

</body> 
</html>
тва ли ти трябва?
 
леле колко съм зле :P несъм дал линк за сайта http://melanholly.no-ip.info/das/this/site.html е тука искам да го сложа :D
и благодаря за отговора сега ще видя кода
 
омг я дай по-подробна информация... къде трябва да е какво да пише и сякви настройки... аз ли искаш да си го измисля :idea: :mrgreen:
а и междувпрочем вземи да сложиш в сорса това
Код: 
<meta http-equiv="imagetoolbar" content="no">
 
Трябва да си влезнал или регистриран, за да отговориш тук.

Back
Горе