Elxis CMS Forum

Ελληνικό Forum => Γενικά Θέματα για το Elxis CMS => Topic started by: babis1 on January 06, 2007, 12:55:18

Title: menu and javascript
Post by: babis1 on January 06, 2007, 12:55:18

ειχα γραψει και σε αλλο topic για ενα μενου που θελω να φτιαξω το οποιο ειναι με script αλλα ηταν μαζι με αλλο θεμα και γιαυτο ξαναρωταω εδω βασικα θελω να καταργησω τα left-right μενου θελω να αφησω το top menu αλλα να εχει τον ακολουθο κωδικα ο οποιος απαρτιζετε απο δυο μερη που θα μπουν αυτα?
ευχαριστω (και που αποθηκευω το script γιατι δεν νομοζω να μορει να μπει αυτο στο index.html)
<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">

/***********************************************
* AnyLink Drop Down Menu- © Dynamic Drive (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit http://www.dynamicdrive.com/ for full source code
***********************************************/

//Contents for menu 1
var menu1=new Array()
menu1[0]='<a href="http://www.javascriptkit.com">JavaScript Kit</a>'
menu1[1]='<a href="http://www.freewarejava.com">Freewarejava.com</a>'
menu1[2]='<a href="http://codingforums.com">Coding Forums</a>'
menu1[3]='<a href="http://www.cssdrive.com">CSS Drive</a>'

//Contents for menu 2, and so on
var menu2=new Array()
menu2[0]='<a href="http://cnn.com">CNN</a>'
menu2[1]='<a href="http://msnbc.com">MSNBC</a>'
menu2[2]='<a href="http://news.bbc.co.uk">BBC News</a>'
      
var menuwidth='165px' //default menu width
var menubgcolor='lightyellow'  //menu bgcolor
var disappeardelay=250  //menu disappear speed onMouseout (in miliseconds)
var hidemenu_onclick="yes" //hide menu when user clicks within menu?

/////No further editting needed

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>

----------------------------------------------------
<a href="default.htm" onClick="return clickreturnvalue()" onMouseover="dropdownmenu(this, event, menu1, '150px')" onMouseout="delayhidemenu()">Web Design</a> |

<a href="default2.htm" onClick="return dropdownmenu(this, event, menu2, '200px')" onMouseout="delayhidemenu()">News Sites</a> (onclick)

--------------------------------------------------------------------------

Title: Re: menu and javascript
Post by: babis1 on January 06, 2007, 19:31:14

απο οτι καταλαβαινω πρεπει να χωριζετε το μερος που θα παει στο css ισως ενα μερος να πρεπει να γινει content αλλα πως?και το τελευταιο να λειτουργει σαν μενου αν υπαρχει ομως καποιο module που να κανει την δουλεια ολη θα ηταν καλο.

Title: Re: menu and javascript
Post by: datahell on January 08, 2007, 09:41:34

Αν θες να φτιάξεις ένα menu με βάση τον κώδικά σου θα πρέπει να φτιάξεις ένα module παραλλαγή του mod_mainmenu που να εμφανίζει τα Link με βάση το script σου. Το css μπορείς να το γράψεις στο css του κυρίως template ή μέσα στο module. Πάντως δεν έχω πολυκαταλάβει τι θες να κάνεις οπότε μην δίνεις και πολύ σημασία σε αυτά που είπα!  ;D :P

Title: Re: menu and javascript
Post by: babis1 on January 10, 2007, 11:20:17

βασικα αυτο θελω να φτιαξω ενα module για το top menu το οποιο να εχει την εμφανιση του top menu αλλα οταν πηγαινεις επανω το ποντικι χωρις να κλικαρις να εμφανιζετε σε καθετη διαταξη το υπολοιπο menu υπαρχει σε πολλες σελιδες απλα δεν εχω βρει ουτε ενα template mambo joomla elxis το οποιο να εχει ενα τετοιο menu μαλλον πρεπει να μπω στην διαδικασια να μαθω να φτιαχνω modules............
ερωτηση....
υπαρχουν καποια βασικα να ξεκινησω?η θα παρω ενα ηδη υπαρχον module και να το επεξεργαστω?
ευχαριστω

Title: Re: menu and javascript
Post by: datahell on January 11, 2007, 11:39:18

Οπότε δεν ψάχνεις για template αλλά για Module.
Το module dynamic menu νομίζω σου κάνει.

https://www.elxis.org/index.php?option=com_mtree&task=viewlink&link_id=61&Itemid=140 (https://www.elxis.org/index.php?option=com_mtree&task=viewlink&link_id=61&Itemid=140)

Title: Re: menu and javascript
Post by: babis1 on January 11, 2007, 20:26:16

αυτο ειναι ;D ευχαριστω τωρα μενει να το παραμετροποιησω ---εγινε και αυτο το βλεπει σαν main menu ;D  ;D ωραιο!!