მთვარი | პროექტის შესახებ | თხოვნები | რეკლამა საიტზე
Чтение RSS
Суперсайт
მთვარი კონტაქტი მენიუ1 ფავორიტებში დამატება
ლოგინი:
პაროლი:
  სალამი,სტუმარი   |    გამოსვლა 
-----------------------------------------------------  
{informer}
  • რეკლამის ადგილი

    გამოკითხვა

    მოგწონთ ჩვენი საიტი
    სულ პასუხი: 574

    Рекомендуем

    • <-----რჩევა---->

    Наши друзья

  • ავტორი: სტუმარი თარიღი: 2024-04-18 ნანახია: 1166




    ეს არის ძან მაგარი მენიუ, ესეიკი აგიხსნით როგორ ხდება.
    სადაც ქვემოთ მოცემულ კოდს დაყენებთ იქ გამოჩნდება ისეთი როგორიც პირველ სურათშია, და პირველ სურათში მაქვს მოგნიშნული და რომ ხედავთ წითელ ღილაკს როდ დაწვებით იშლება მენიუ და ისეთი ხდება როგორიც არის მეორე სურათში. ქვემოთ სურათში არის მართო 5 მე საჩვენებლად ეგრე გავაკეთე და თქვენ შეგიძლიათ მოკლება და ასევე დამატება.





    კოდი:
    <style type="text/css"> 
    .dot { position: absolute; width: 6; height: 6; visibility: hidden; background-color: red; font-size: 1px; cursor: pointer; cursor: hand; z-index: 100 } 
    .dotoff { position: absolute; width: 6; height: 6; visibility: hidden; background-color: gray; font-size: 1px; cursor:default; z-index: 100} 
    .dotempty { position: absolute; width: 6; height: 6; visibility: hidden; background-color: orange; font-size: 1px; cursor: pointer; cursor: hand; zindex: 100 } 
    .caption { position: absolute; visibility: hidden; font-family: Tahoma; color: black; 
      font-size: 11px; text-align: Center; cursor: default; z-index: 
      1 } 

    body { margin: 0px; background-color: white; } 
    a { color: silver; text-decoration: none } 
    p { font-size: 10px; font-family: tahoma; color: black } 
    </style> 
    <script language="JavaScript" type="text/javascript"> 

    function lib_bwcheck(){ //Browsercheck (needed) 
      this.ver=navigator.appVersion 
      this.agent=navigator.userAgent 
      this.dom=document.getElementById?1:0 
      this.opera5=this.agen t.in dexOf("Opera 5")>-1 
      this.ie5=(this.ver.indexOf("MSIE 5")>-1 && this.dom && !this.opera5)?1:0; 
      this.ie6=(this.ver.indexOf("MSIE 6")>-1 && this.dom && !this.opera5)?1:0; 
      this.ie4=(document.all && !this.dom && !this.opera5)?1:0; 
      this.ie=this.ie4||this.ie5||this.ie6 
      this.mac=this.agent.indexOf("Mac")>-1 
      this.ns6=(this.dom && parseInt(this.ver) >= 5) ?1:0; 
      this.ns4=(document.layers && !this.dom)?1:0; 
      this.bw=(this.ie6 || this.ie5 || this.ie4 || this.ns4 || this.ns6 || this.opera5) 
      return this 

    var bw=new lib_bwcheck() 

    // The code of this script is in the body, the browsercheck above is not used. 

    </script> 

    </head> 
    <body bgcolor="#737994" text="#FFFFFF" link="#FFFFFF" topmargin="0" leftmargin="0"> 

    <script language="javascript1.2" type="text/javascript"> 
    <!-- 
    // DotMenu 
    // provides cross-browser functionality 
    //====================================== 
    function getObjectRef(name) { 
      if(document.getElementById) return document.getElementById(name); 
      else if(document.all) return document.all[name]; 
      else return null; 


    // general functions to assist the script 
    //======================================== 
    function show(name) { 
      var el = getObjectRef(name); 
      if(el) el.style.visibility = "visible"; 

    function hide(name) { 
      var el = getObjectRef(name); 
      if(el) el.style.visibility = "hidden"; 

    function getWidth(name) { 
      var el = getObjectRef(name); 
      return el.offsetWidth; 

    function getHeight(name) { 
      var el = getObjectRef(name); 
      return el.offsetHeight; 

    function moveMe(name,x,y) { 
      var el = getObjectRef(name); 
      if(el) { el.style.top = parseInt(y); el.style.left = parseInt(x); } 

    function moveBy(name,x,y) { 
      var el = getObjectRef(name); 
      if(el) { el.style.top = parseInt(el.style.top) + parseInt(y); el.style.left = parseInt(el.style.left) + parseInt(x); } 


    // Creates the menu objects 
    //========================== 
    var menuCount = 0; 
    function menuObject(name,x,y,caption, r, parent) { 
      if ( (!document.getElementById&&!document.all) || navigator.userAgent.indexOf("Opera")>-1) return; 
      document.write('<div id="divDot' + menuCount + '" class="dotempty" style="top: ' + y + '; left: ' + x + '"></div>'); 
      document.write('<div id="divCap' + menuCount + '" class="caption" style="top: 0; left: 0">' + caption + '</div>'); 
      
      this.name = name; 
      this.parent = parent 
      this.ref = "divDot" + menuCount; 
      this.caption = "divCap" + menuCount 
      if(r) this.radius = r; 
      else this.radius = 400; 
      this.subMenus = new Array(); 
      this.state = 0; 
      this.moving = false; 
      if(this.parent) this.action = "null"; 
      else this.action = "toggle"; 
      if(this.parent) this.startAngle = parent.startAngle; 
      else this.startAngle = 0; 

      getObjectRef(this.ref).objRef = this.name; 
      
      this.show = function() { show(this.ref); } 
      this.hide = function() { hide(this.ref); } 
      this.moveMe = function(x,y) { if(this.parent) { x += this.parent.x(); y += this.parent.y(); } moveMe(this.ref,x,y); } 
      this.moveBy = function(x,y) { moveBy(this.ref,x,y); } 
      this.x = function() { return parseInt(getObjectRef(this.ref).style.left); } 
      this.y = function() { return parseInt(getObjectRef(this.ref).style.top); } 
      this.w = function() { return getWidth(this.ref); } 
      this.h = function() { return getHeight(this.ref); } 

      this.showCaption = function() { 
      moveMe(this.caption, this.x() - (getWidth(this.caption)/2) + (this.w()/2), (this.y() + this.h())); 
      show(this.caption); 
      } 
      this.hideCaption = function() { 
      hide(this.caption); 
      } 
      this.setCaption = function(c) { getObjectRef(this.caption).innerHTML = c;} 
      
      this.addItem = function(c,action,r) { 
      getObjectRef(this.ref).className = "dot"; 
      if(!r) r = this.radius/2; 
      var sub = new menuObject(this.name + ".subMenus[" + this.subMenus.length + "]",0,0,c,r,this);
      sub.parent = this; 
      sub.action = action; 
      sub.moveMe(0,0); 
      this.subMenus[this.subMenus.length] = sub; 
      return sub; 
      } 
      
      this.expand = function() { 
      if(this.subMenus.length > 0) { 
      var p = true; 
      if(this.parent) { 
      p = !this.parent.moving; 
      for(var i=0; i<this.parent.subMenus.length;i++) 
      p = p && ((this.parent.subMenus[i].state==0) || (this.parent.subMenus[i].state==this.parent.subMenus[i].subMenus.length)) && (this.parent.subMenus[i].moving==false); 
      } else var o = false; 
      

      if((!this.parent || this.parent.state == this.parent.subMenus.length) && p) { 
      if(this.parent) this.collapseAll(this.name); 
      
      var diff = 360 / this.subMenus.length; 
      for(var i=0;i<this.subMenus.length;i++){ 
      this.subMenus[i].moveMe(0,0); 
      this.subMenus[i].show(); 
      this.moving = true; 
      this.subMenus[i].slide(this.subMenus[i].radius * cos(degToRad((diff*i)+this.startAngle)), this.subMenus[i].radius * sin(degToRad((diff*i)+this.startAngle)), this.name + ".subMenus[" + i + "].showCaption();" + this.name + ".moving=false;" + this.name + ".state+=1;"); 
      } 
      if(this.parent){ 
      getObjectRef(this.parent.ref).style.filter = "alpha (opacity=33)"; 
      getObjectRef(this.parent.ref).style.MozOpacity = "33%"; 

      getObjectRef(this.parent.ref).className = "dotoff"; 
      getObjectRef(this.parent.caption).style.filter = "alpha (opacity=33)"; 
      getObjectRef(this.parent.caption).style.MozOpacity = "33%"; 
      for(i=0;i<this.parent.subMenus.length;i++) { 
      getObjectRef(this.parent.subMenus[i].ref).style.filter = "alpha (opacity=66)"; 
      getObjectRef(this.parent.subMenus[i].ref).style.MozOpacity = "66%"; 
      getObjectRef(this.parent.subMenus[i].caption).style.filter = "alpha (opacity=66)"; 
      getObjectRef(this.parent.subMenus[i].caption).style.MozOpacity = "66%"; 
      } 
      if(this.parent.parent) { 
      for(i=0;i<this.parent.parent.subMenus.length;i++) { 
      getObjectRef(this.parent.parent.subMenus[i].ref).style.filter = "alpha (opacity=33)"; 
      getObjectRef(this.parent.parent.subMenus[i].ref).style.MozOpacity = "33%"; 
      getObjectRef(this.parent.parent.subMenus[i].ref).className = "dotoff"; 
      getObjectRef(this.parent.parent.subMenus[i].caption).style.filter = "alpha (opacity=33)"; 
      getObjectRef(this.parent.parent.subMenus[i].caption).style.MozOpacity = "33%"; 
      } 
      getObjectRef(this.parent.parent.ref).style.MozOpacity = "33%"; 
      getObjectRef(this.parent.parent.ref).style.MozOpacity = "33%"; 
      getObjectRef(this.parent.parent.ref).className = "dotoff"; 
      } 
      } 
      getObjectRef(this.ref).style.filter = "alpha (opacity=66)"; 
      getObjectRef(this.caption).style.filter = "alpha (opacity=66)"; 
      getObjectRef(this.ref).style.MozOpacity = "66%"; 
      getObjectRef(this.caption).style.MozOpacity = "66%"; 
      } 
      } 
      } 

      this.collapse = function() { 
      var p = true; 
      p = !this.moving; 
      for(var i=0; i<this.subMenus.length;i++) 
      p = p && (this.subMenus[i].state==0) && (this.subMenus[i].moving==false); 
      
      if(p && this.subMenus.length > 0) { 
      for(var i=0;i<this.subMenus.length;i++){ 
      this.subMenus[i].hideCaption(); 
      this.moving = true; 
      this.subMenus[i].slide(0, 0, this.name + ".subMenus[" + i + "].hide();" + this.name + ".moving=false;" + this.name + ".state-=1;"); 
      } 
      if(this.parent){ 
      getObjectRef(this.parent.ref).style.filter = "alpha (opacity=66)"; 
      getObjectRef(this.parent.ref).style.MozOpacity = "66%"; 
      if(this.parent.subMenus.length != 0) 
      getObjectRef(this.parent.ref).className = "dot"; 
      else 
      getObjectRef(this.parent.ref).className = "dotempty"; 
      getObjectRef(this.parent.caption).style.filter = "alpha (opacity=66)"; 
      getObjectRef(this.parent.caption).style.MozOpacity = "66%"; 
      for(i=0;i<this.parent.subMenus.length;i++) { 
      getObjectRef(this.parent.subMenus[i].ref).style.filter = "alpha (opacity=100)"; 
      getObjectRef(this.parent.subMenus[i].ref).style.MozOpacity = "100%"; 
      if(this.parent.subMenus[i].subMenus.length != 0) 
      getObjectRef(this.parent.subMenus[i].ref).className = "dot"; 
      else 
      getObjectRef(this.parent.subMenus[i].ref).className = "dotempty"; 
      getObjectRef(this.parent.subMenus[i].caption).style.filter = "alpha (opacity=100)"; 
      getObjectRef(this.parent.subMenus[i].caption).style.MozOpacity = "100%"; 
      } 
      if(this.parent.parent) { 
      for(i=0;i<this.parent.parent.subMenus.length;i++) { 
      getObjectRef(this.parent.parent.subMenus[i].ref).style.filter = "alpha (opacity=66)";
      getObjectRef(this.parent.parent.subMenus[i].ref).style.MozOpacity = "66%"; 
      if(this.parent.parent.subMenus[i].subMenus.length != 0) 
      getObjectRef(this.parent.parent.subMenus[i].ref).className = "dot"; 
      else 
      getObjectRef(this.parent.parent.subMenus[i].ref).className = "dotempty"; 
      getObjectRef(this.parent.parent.subMenus[i].caption).style.filter = "alpha (opacity=66)"; 
      getObjectRef(this.parent.parent.subMenus[i].caption).style.MozOpacity = "66%"; 
      } 
      } 
      } 
      getObjectRef(this.ref).style.filter = "alpha (opacity=100)"; 
      getObjectRef(this.caption).style.filter = "alpha (opacity=100)"; 
      getObjectRef(this.ref).style.MozOpacity = "100%"; 
      getObjectRef(this.caption).style.MozOpacity = "100%"; 
      } 
      } 

      this.collapseAll = function(except) { 
      for(var i=0;i<this.parent.subMenus.length;i++) { 
      if(this.parent.subMenus[i].name!=except && this.parent.subMenus[i].state==this.parent.subMenus[i].subMenus.length) { 
      this.parent.subMenus[i].collapse(); 
      } 
      } 
      } 
      
      this.toggle = function(e) { 
      if(document.all) id = window.event.srcElement; 
      else id = e.target; 
      var dot = eval(id.objRef); 
      
      if(dot.state==0 && !dot.moving) dot.expand(); 
      else if(dot.state==dot.subMenus.length && !dot.moving) dot.collapse() 
      } 
      
      this.doAction = function(e) { 
      if(document.all) id = window.event.srcElement; 
      else id = e.target; 
      var dot = eval(id.objRef); 
      
      if(dot.action == "toggle") dot.toggle(e); 
      else eval(dot.action); 
      } 
      
      //change these if you want to change the events that trigger the actions 
      //======================================================================== 
      //getObjectRef(this.ref).onmousemove = this.toggle; 
      getObjectRef(this.ref).onmouseup = this.doAction; 
      
      this.slide = function(xx,yy,func) { 
      if(!func) func = ""; 
      var px = this.parent.x(); 
      var py = this.parent.y(); 
      
      var x = xx - this.x() + px; 
      var y = yy - this.y() + py; 
      
      var d = sqrt(square(xx-this.x() + px) + square(yy-this.y() + py)); 
      
      var v = d/8; 
      if(v<1) v = 1; 
      
      if( (Math.abs(x) < v) && (Math.abs(y) < v) ) { 
      moveMe(this.ref,xx + px,yy + py); 
      if(func != "") eval(func); 
      } else { 
      var a = round(atan(x,y)); 
      dx = round(v * cos(degToRad(a))); 
      dy = round(v * sin(degToRad(a))); 
      
      this.moveBy(dx,dy); 
      setTimeout(this.name + ".slide(" + xx + "," + yy + ", '" + func + "');",10); 
      } 
      } 
      // Preoading the windows filters. 
      if (menuCount==0 && document.all) document.all[this.ref].style.filter = "alpha (opacity=100)"; 
      menuCount++; 
      return this; 


    // Math functions 
    //================ 
    var pi = Math.PI; 
    function square(x) { return (x*x); } 
    function sqrt(x) { return Math.sqrt(x); } 
    function round(x) { return Math.round(x); } 
    function rand(x,y) { return (round(Math.random()*(y-x)) + x); } 

    function cos(x) { return Math.cos(x) } 
    function sin(x) { return Math.sin(x) } 
      
    function degToRad(x) { return ( x/(360/(2*pi)) ); } 
    function radToDeg(x) { return ( x*(360/(2*pi)) ); } 

    function atan(s,t) { 
      if( s == 0.0 && t > 0.0) 
      angle = 90.0; 
      else if(s == 0.0 && t < 0.0) 
      angle = 270.0; 
      else if (s < 0.0 ) 
      angle = 180.0 + radToDeg(Math.atan(t/s)); 
      else if (s > 0.0 && t < 0.0) 
      angle = 360.0 + radToDeg(Math.atan(t/s)); 
      else { 
      if(s==0.0) s=0.00001; 
      angle = radToDeg(Math.atan(t/s)); 
      } 
      if(angle < 0.0) angle += 360.0; 
      return angle; 


    //==================================================================================== 
    // make the menus and provide information on usage 
    //==================================================================================== 
    // 
    // In order to customise your menus all you need to do is: 
    // - edit the styles .dot, .dotoff and .caption 
    // - add the main menu using the following code 
    // var [menu_name] = new menuObject("[menu_name]", [x position], [y position], [caption], [spacing between sub menus]); 
    // - add the subemus using: 
    // var [sub_menu] = [menu_name].addItem([caption],[action],[spacing]); 
    // OR 
    // var [sub-sub_menu] = [sub_menu].addItem([caption],[action],[spacing]); 
    // OR 
    // [menu_name].subMenus[x].addItem([caption],[action],[spacing]); 
    // 
    // - where action is string that get's evaluated when the dot is clicked 
    // 
    // (NOTE the spacing is optional and if left blank gets inherited 
    // and is equal to the (parent's value)/2 - the default for 
    // the main menu item uis 400) 
    // 
    // - the following allow extra manipulation of the menus: 
    // + menuItem.show() - show's the menu's dot 
    // + menuItem.showCaption() - show's the menu's caption 
    // + menuItem.hide() 
    // + menuItem.hideCaption() 
    // + menuItem.startAngle = x - default is 0-degrees which means the first submenu appears 
    // directly to the right, the following items are traced in a 
    // clockwise direction 
    // + menuItem.setCaption("text") - allows you to change a menus caption 
    // + menuItem.expand() - opens a menus submenus (if they exist) 
    // + menuItem.collapse() - closes a menu's subItems (unless one of them is open) 
    // 
    // + menuItem.moveMe(x,y) - moves a menu to coordinates (x,y) 
    // + menuItem.moveBy(x,y) - moves a menu by (x,y)-pixels 
    // + menuItem.x() & menuItem.y() - retrieve a menus coordinates 
    // 
    //==================================================================================== 

    //get dimentions of the page 
    if(document.all) pageWidth = document.body.offsetWidth-20; 
    else pageWidth = innerWidth; 
    if(document.all) pageHeight = document.body.offsetHeight-4; 
    else pageHeight = innerHeight; 

    //Create main menu 
    var menu = new menuObject("menu",pageWidth/2,pageHeight/2,"მენიუ",pageHeight/2); 
    menu.startAngle = -90; 

    //show menu and caption 
    menu.show(); 
    menu.showCaption(); 

    //Add submenus 
    menu.addItem("news","window.open('/news')"); 
    menu.addItem("scripts","toggle"); 
    menu.addItem("tutorials","toggle"); 
    menu.addItem("forums","toggle"); 
    menu.addItem("resources","toggle"); 

    menu.subMenus[1].addItem("FoldOutMenu","window.open('/script/script22.asp')"); 
    menu.subMenus[1].addItem("Loading Bar","window.open('/script/script17.asp')"); 
    menu.subMenus[1].addItem("Window Script","window.open('/script/script16.asp')"); 
    menu.subMenus[1].addItem("PageSlideFade","window.open('/script/script15.asp')"); 
    menu.subMenus[1].addItem("Circle Menu","window.open('/script/script14.asp')"); 
    menu.subMenus[1].addItem("Annimation Intro","window.open('/script/script9.asp')"); 
    menu.subMenus[1].addItem("NewsSlideFade","window.open('/script/script10.asp')"); 
    menu.subMenus[1].addItem("Other Scripts","window.open('/script/')"); 

    menu.subMenus[2].addItem("Scripting for vs5 browsers","window.open('/tutorials/tutorial5.asp')"); 
    menu.subMenus[2].addItem("Makeing a Dhtml Script","window.open('/tutorials/tutorial6.asp')"); 
    menu.subMenus[2].addItem("Filters & Transitions","window.open('/tutorials/tutorial4.asp')"); 
    menu.subMenus[2].addItem("Dhtml Library","window.open('/tutorials/tutorial3.asp')"); 
    menu.subMenus[2].addItem("Document Size","window.open('/tutorials/tutorial2.asp')"); 
    menu.subMenus[2].addItem("Dhtml Intro","window.open('/tutorials/tutorial1.asp')"); 

    menu.subMenus[3].addItem("Forum listings","window.open('/forums')"); 
    menu.subMenus[3].addItem("Cool Sites","window.open('/forums/forum.asp?FORUM_ID=1&CAT_ID=1&Forum_Title=Cool+sites')"); 
    menu.subMenus[3].addItem("CoolMenus","window.open('/forums/forum.asp?FORUM_ID=2&CAT_ID=1&Forum_Title=CoolMenus')"); 
    menu.subMenus[3].addItem("Cross Browser","window.open('/forums/forum.asp?FORUM_ID=3&CAT_ID=1&Forum_Title=Crossbrowser+DHTML')"); 
    menu.subMenus[3].addItem("Scripts","window.open('/forums/forum.asp?FORUM_ID=4&CAT_ID=1&Forum_Title=DHTML+Scripts')"); 
    menu.subMenus[3].addItem("General","window.open('/forums/forum.asp?FORUM_ID=6&CAT_ID=1&Forum_Title=General+DHTML+issues')"); 
    menu.subMenus[3].addItem("Off-Topic","window.open('/forums/forum.asp?FORUM_ID=9&CAT_ID=1&Forum_Title=Off%2Dtopic')"); 

    c = menu.subMenus[4].addItem("Cool Sites","toggle"); 
    c.startAngle = 15; 
    menu.subMenus[4].addItem("Portals","window.open('/resources/default.asp?catid=7&cattitle=Portals')"); 
    menu.subMenus[4].addItem("Script Sites","window.open('/resources/default.asp?catid=1&cattitle=Script+sites')"); 
    menu.subMenus[4].addItem("Tutorials &<br>References","toggle"); 

    menu.subMenus[4].subMenus[0].addItem("Comercial Sites","window.open('/resources/default.asp?catid=5&cattitle=Commercial+sites')"); 
    menu.subMenus[4].subMenus[0].addItem("Personal Sites","window.open('/resources/default.asp?catid=6&cattitle=Personal+sites')"); 
    menu.subMenus[4].subMenus[0].addItem("Experimental Projects","window.open('/resources/default.asp?catid=4&cattitle=Experimental+projects')"); 

    menu.subMenus[4].subMenus[3].addItem("References","window.open('/resources/default.asp?catid=8&cattitle=References')"); 
    menu.subMenus[4].subMenus[3].addItem("Tutorials & Articles","window.open('/resources/default.asp?catid=9&cattitle=Tutorials+and+Articles')"); 

    //--></script>


    პაროლი არქივზე

ზევით

Реклама

Free site builder - uCoz