На главную
ПРАВИЛА FAQ Помощь Участники Календарь Избранное DigiMania RSS
msm.ru
Модераторы: ElcnU, ANDLL, fatalist
Страницы: (2) [1] 2  все  ( Перейти к последнему сообщению )  
> FAQ по JavaScript
    Как сделать таблицы на странице удобнее?

    Автор: Tishaishii

    Скрипт кроссбраузерный. Проверен на MSIE 6.0 и в Mozilla 5.0 FireFox 0.8. В Opera просто не работает, Netscape 7.0 - только подсветка строк без сортировки по столбцам.

    Это сообщение было перенесено сюда или объединено из темы "FAQ"
    Сообщение отредактировано: Tishaishii -

    Прикреплённый файлПрикреплённый файлtable2xls.zip (3.03 Кбайт, скачиваний: 305)

      1. Как отключить правую кнопку мыши?

      Автор: Mastilior
      Язык: HTML и JavaScript


      Два одинаковых решения на HTML и JavaScript:

      HTML:
      ExpandedWrap disabled
        <body oncontextmenu="return false;">
        </body>


      JavaScript:
      ExpandedWrap disabled
        <script language="JavaScript">
        <!--
        document.oncontextmenu=function() { return false; }
        //-->
        </script>


      Но имейте ввиду, что этот способ будет работать только в том случае, если пользователь не отключил в своем обозревателе возможность перехвата нажатия правой кнопки мыши.
      Сообщение отредактировано: fatalist -
      :-р

        2. Как при нажатии на одну ссылку загрузить сразу две?

        Автор: Mastilior
        Язык:HTML и JavaScript


        index.htm
        ExpandedWrap disabled
          <html>
          <frameset rows="30,*,60">
          <frame name=topframe src="topframe.htm">
          <frame name=frame1>
          <frame name=frame2>
          </frameset>
          </html>


        topframe.htm
        ExpandedWrap disabled
          <html>
          <head>
          <script language="JavaScript">
          <!--
          function load_two_links(link1,link2)
          {
          top.frames["frame1"].location=link1;
          top.frames["frame2"].location=link2;
          }
          //-->
          </script>
          <body>
          <a href="javascript:load_two_links('frame1.htm','frame2.htm');">Загрузить две ссылки!</a>
          </body>
          </html>


        frame1.htm и frame2.htm - любые HTML-файлы
        Сообщение отредактировано: fatalist -

        Прикреплённый файлПрикреплённый файлExample.zip (0.75 Кбайт, скачиваний: 221)
        :-р

          3. Как на JavaScript заставить кнопку не реагировать на нажатие?

          При отправке формы на сервер, существует риск, того что форма будет отправленна несколько раз (например, если мышка у юзера барахлит). Как бы сделать так, чтобы кнопку отправки формы можно было бы нажать только один раз?

          Автор: Mixxx
          Язык: JavaScript


          У кнопок, как и у других элементов формы
          есть такое замечательное свойство — «disabled».
          По умолчанию оно установленно в false, сие означает, что кнопку можно нажимать.
          Если же его значение поменять на true, то кнопка перестанет поддаваться нажатию.

          Осталось только ответить на два вопроса
          1. В какой именно момент запретить кнопку?
          2. Как из javascript'a добраться до нашей кнопки?

          После того как форма (которая активируется по нажатию кнопки) будет приготовленна к отправке — это событие в javascript называется onsubmit.

          Второй вопрос несколько сложнее: первое, что приходит в голову так это дать кнопке
          уникальное имя (атрибут id), и воспользоваться стандартным DOM методом объекта document — document.getElementById('уникальное_имя'):
          ExpandedWrap disabled
            <form onsubmit="document.getElementById('mybutton').disabled=true">
            <input type="submit" value="knopka" id="mybutton">
            </form>

          Этот способ будет работать, однако он весьма громоздкий и не универсальный (если мы захотим сделать несколько кнопок с запретом после нажатия, придёться изменять id поскольку уникальный идентификатор не может повторяться ).
          В нашем случае кнопку из скрипта можно достать более компактным кодом.
          Всё дело в том, что если мы пишем какой-нибудь обработчик события внутри какого-нибудь тега, то нам становится доступен указатель на этот самый тег и называется он «this»
          А из тега форм до любой её кнопки - добраться очень просто, для этого достаточно знать её имя (в нашем примере она называеться - "subm").

          Ввиду всего выше сказанного получаем следующее:
          ExpandedWrap disabled
            <form onsubmit="this.subm.disabled=true">
            <input type="submit" value="knopka" name="subm">
            </form>


          Данный пример можно украсить, например, до нажатия кнопка будет иметь зелёный цвет (символизируя свою доступность), а после нажатия она окрасится в красный (который у многих ассоциируется с опасностью или запретным плодом)
          ExpandedWrap disabled
            <form onsubmit="this.subm.disabled=true;this.subm.style.backgroundColor='red'">
            <input type="submit" value="knopka" style="background-color:green" name="subm">
            </form>
          Сообщение отредактировано: fatalist -
          /(bb|[^b]{2})?/ ©Уильям Шекспир

            4. Пример создания собственного интефейса событий на JavaScript.

            Этот вариант для загрузчика картинок.
            ExpandedWrap disabled
              ////////////////////////////////////////////////////////////////////////////////////////
              ////////////////////////////////////////////////////////////////////////////////////////
              ////////////////////////////////////////////////////////////////////////////////////////
                          function EventHandle(object)
                          {
                              this.parent=object;
                              this.hasParent=this.parent!=null;
                              this.events={};
                              return this;
                          }
               
                          function EventHandle.prototype.eventName(name)
                          {
                              return "On"+name;
                          }
               
                          function EventHandle.prototype.Call(name)
                          {
                              name=this.eventName(name);
                              if(this.events[name]==null)return null;
                              else return this.events[name]();
                          }
               
                          function EventHandle.prototype.Attach(name, func)
                          {
                              name=this.eventName(name);
                              this.events[name]=func;
                              if(this.hasParent)this.parent[name]=func;
                              return true;
                          }
               
                          function EventHandle.prototype.Detach(name)
                          {
                              name=this.eventName(name);
                              delete this.events[name];
                              if(this.hasParent)delete this.parent[name];
                              return true;
                          }
               
                          function EventHandle.prototype.Assign(events)
                          {
                              if(events==null)return null;
                              for(this.last_name in events)
                                  this.Attach(this.last_name, events[this.last_name]);
                              return true;
                          }
              ////////////////////////////////////////////////////////////////////////////////////////
              ////////////////////////////////////////////////////////////////////////////////////////
              ////////////////////////////////////////////////////////////////////////////////////////
                          function BitmapLoader(events)
                          {
                              this.event=new EventHandle(this);
                              this.event.Assign(events);
                              this.event.Call("BeforeCreate");
                              this.images=[];
                              this.events=[];
                              this.counter=0;
                              this.event.Call("AfterCreate");
                              return this;
                          }
               
                          function BitmapLoader.prototype.Add(path)
                          {
                              this.event.Call("Add");
                              this.img=new Image();
                              this.img.src=path;
                              this.images.push(this.img);
                              return this.img;
                          }
               
                          function BitmapLoader.prototype.Length()
                          {
                              this.event.Call("Length");
                              return this.images.length;
                          }
               
                          function BitmapLoader.prototype.Count()
                          {
                              this.event.Call("Count");
                              this.counter=0;
                              for(this.i=0; this.i<this.images.length; this.i++)
                                  if(this.images[this.i].complete)this.counter++;
                              return this.counter;
                          }
               
                          function BitmapLoader.prototype.Loaded()
                          {
                              this.event.Call("Loaded");
                              this.result=this.Count()==this.Length();
                              if(this.result)this.event.Call("Load");
                              return this.result;
                          }
               
                          function BitmapLoader.prototype.Wait(bmploader)
                          {
                              if(this.loader==null)
                              {
                                  if(bmploader==null)return null;
                                  else this.loader=bmploader;
                              }
                              if(this.loader.Loaded())return true;
                              return setTimeOut("BitmapLoader.prototype.Wait()");
                          }
               
                          function BitmapLoader.prototype.Begin(images)
                          {
                              this.event.Call("Begin");
                              while(images.length)this.Add(images.pop());
                              BitmapLoader.prototype.Wait(this);
                              return this.images;
                          }
              ////////////////////////////////////////////////////////////////////////////////////////
              ////////////////////////////////////////////////////////////////////////////////////////
              ////////////////////////////////////////////////////////////////////////////////////////
              var base=[];
              var path="images/";
              var ext=".gif";
              for(var i=0; i<17; i++)
                  base.push(path+i.toString()+ext);//Создаётся список путей к
                                                  // картинкам типа "images/%s.gif"
               
              var bmpLoader=new BitmapLoader({
                              "Load":new Function("alert('Картинки загружены');")
                              //При загрузке.
                          });
              var img_handle=bmpLoader.Begin(base);
              //Или
              bmpLoader.OnLoad();// Вызов процедуры для события "OnLoad" автономно от сыбытия
              ////////////////////////////////////////////////////////////////////////////////////////
              ////////////////////////////////////////////////////////////////////////////////////////
              ////////////////////////////////////////////////////////////////////////////////////////
            Сообщение отредактировано: fatalist -

              5. Пример многопоточного клиентского макроса на JavaScript.

              Эта реализация работает только во MSIE >=5.0. Требует плагин VML.

              На самом деле одной из таракашек можно управлять с помощью стрелок на клавиатуре, только она сопротивляется.
              Сообщение отредактировано: fatalist -

              Прикреплённый файлПрикреплённый файлthreads.zip (34.75 Кбайт, скачиваний: 260)
                Починенный плагин с кодовым именем "таблица-ца-ца" и новый с кодовым же именем "кнопка-ца-ца".
                Что внутри? Плагины на JavaScript, которые делают старые компоненты страницы TABLE и BUTTON удобнее или красивее. Ни к чему не обязывают, ничего на странице менять не надо. Только подгрузить файл с плагином и запустить соответствующую функцию. Остальное сделается само.
                Плагин "кнопка-ца-ца" работает в Netscape 7, FireFox 0.93, MSIE >=5.0, в Opera - ничего не работает. Вообще Opera, наверное, самый безопасный браузер, - там ничего не работает.:)
                Плагин "табли-ца-ца" работает, как и прежде, во MSIE >=5.0, Netscape 7, FireFox 0.93, во всяком случеа, там испытано.

                Это сообщение было перенесено сюда или объединено из темы "FAQ"
                Сообщение отредактировано: Tishaishii -

                Прикреплённый файлПрикреплённый файлtza_tza.zip (6.96 Кбайт, скачиваний: 709)

                  6. Как подгрузить XML на страницу?

                  Автор: Tishaishii
                  Язык: HTML и JavaScript


                  test.html:
                  ExpandedWrap disabled
                    <html>
                    <body>
                    <script ID="xml_doc" language="xml" src="test.xml"></script>
                    <script language="JavaScript">
                        alert(xml_doc.XMLDocument.documentElement.getElementsByTagName("item")[0].text);
                    </script>
                    </body>
                    </html>


                  test.xml:
                  ExpandedWrap disabled
                    <root>
                        <item id="i1">Содержание 1</item>
                        <item id="i2">Содержание 2</item>
                    </root>


                  А можно прямо так:
                  ExpandedWrap disabled
                    <html>
                    <body>
                    <script ID="xml_doc" language="xml"><root>
                        <item id="i1">Содержание 1</item>
                        <item id="i2">Содержание 2</item>
                    </root></script>
                    <script language="JavaScript">
                        alert(xml_doc.XMLDocument.documentElement.getElementsByTagName("item")[0].text);
                    </script>
                    </body>
                    </html>


                  А работает только в IE >=6, раньше не проверял.
                  Сообщение отредактировано: fatalist -

                    Программка на JavaScript - выводит 10 чаще всего встречающихся слов из документа Word.

                    HTA - Hyper Text Application - набивное чучело Micrisoft - построение приложений на основе локализованных web-страниц. По крайней мере в Win2000 Professional, файл *.hta запускать можно двумя щелчками.
                    Сообщение отредактировано: fatalist -

                    Прикреплённый файлПрикреплённый файлwordtree.zip (1.66 Кбайт, скачиваний: 966)

                      7. Как обозначить все checkbox-ы

                      Автор: Mixxx
                      Язык: JavaScript


                      Вот сама функция
                      ExpandedWrap disabled
                        function selAll(E)
                        {
                        for(var i=0;i<E.length;i++)
                          if(typeof E[i].type!='undefined' && E[i].type.toLowerCase()=='checkbox')
                            E[i].checked=true;
                        }


                      А вот небольшой пример
                      ExpandedWrap disabled
                        <form>
                            <input type="checkbox" >
                            <input type="CHECKBOX" >
                            <input type="checkbox" >
                         
                            <input type=button value=Всё onclick="selAll(this.form.elements)">
                            <input type=reset value=Ничего>
                        </form>
                      Сообщение отредактировано: fatalist -
                      Да вот и кончилось моё прибывание здесь - так иногда в гости зайду (-:

                        7. Работа с курсором мыши.

                        7.01. Наведение мыши на элементы формы
                        ExpandedWrap disabled
                          <html>
                          <body>
                          <script language="javascript" type="text/javascript">
                          <!--
                          function OnMouseOver() {
                              myText.innerText = "Курсор над кнопкой";
                          }
                          function OnMouseOut() {
                              myText.innerText = "Курсор бродит по странице";
                          }
                          // -->
                          </script>
                          <input id="myButton" type="button" value="button" language="javascript" onmouseover="return OnMouseOver()" onmouseout="return OnMouseOut()" />
                          <br/>
                          <span id="myText"></span>
                          </body>
                          </html>


                        7.02. Подсказки при наведении на ссылки
                        ExpandedWrap disabled
                          <!--HTML код-->
                          <html>
                          <body>
                          <table onmouseout=show(0.1);>
                           <tr><td>
                                   <table>
                                    <tr><td> <a href=yourlink.html onmouseover=show(1);>Здесь ваша ссылка №1</a></td></tr>
                                    <tr><td> <a href=yourlink.html onmouseover=show(2);>Здесь ваша ссылка №2</a></td></tr>
                                   </table>
                           </td>
                           <td id=desc valign=top> Здесь будут появляться подсказки</td></tr>
                          </table>
                          </body>
                          </html>

                        ExpandedWrap disabled
                          <!-- JavaScript -->
                          <SCRIPT LANGUAGE="JavaScript">
                          function show(n)
                                       {
                                       var cdesc; switch (n)
                                                         {
                                                         case 0.1: cdesc="Ваш текст, который будет по умолчанию";
                                                              break;
                                                         case 1: cdesc="Текст, при наведении на ссылку 1";
                                                              break;
                                                         case 2: cdesc="Текст, при наведении на ссылку 2";
                                                              break;
                                                         }
                                       desc.innerText=cdesc;
                                       }
                          </SCRIPT>


                        7.03. Изменение цвета фона
                        ExpandedWrap disabled
                          <html>
                          <body>
                          <table width=60% border=1 cellspacing=0 cellpadding=4 bordercolor=#333333 align=center>
                           <tr>
                            <td align=center bgcolor=#CCCCCC onMouseOver="this.style.background='#FFCC33'" onMouseOut="this.style.background='#CCCCCC'">
                             <a href="link1.htm">Пункт 1</a></td>
                            <td align=center bgcolor=#CCCCCC>
                             <a href="link2.htm">Пункт 2</a></td>
                           </tr>
                          </table>
                          </body>
                          </html>


                        7.04. Создание ячейки как ссылки
                        ExpandedWrap disabled
                          <html>
                          <body>
                          <table width=60% border=1 cellspacing=0 cellpadding=4 bordercolor=#333333 align=center>
                           <tr>
                            <td align=center bgcolor=#CCCCCC onMouseOver="this.style.background='#FFCC33'" onMouseOut="this.style.background='#CCCCCC'" onClick="document.location='1.html'" style="cursor: hand">
                             <a href="link1.htm">Пункт 1</a></td>
                            <td align=center bgcolor=#CCCCCC>
                             <a href="link2.htm">Пункт 2</a></td>
                           </tr>
                          </table>
                          </body>
                          </html>


                        7.05. Изменение свойств ячейки
                        ExpandedWrap disabled
                          <!--HTML код-->
                          <html>
                          <body>
                          <table width=60% border=1 cellspacing=0 cellpadding=4 bordercolor=#333333 align=center>
                           <tr>
                            <td align=center bgcolor="#CCCCCC" ID="c1">
                             <a href="link1.htm" onMouseOver="newColor('c1')" onMouseOut="backColor('c1')">Пункт1</a>
                            </td>
                            <td align=center bgcolor="#CCCCCC" ID="c2">
                             <a href="link2.htm" onMouseOver="newColor('c2')" onMouseOut="backColor('c2')">Пункт2</a>
                            </td>
                          </tr>
                          </table>
                          </body>
                          </html>

                        ExpandedWrap disabled
                          <!-- JavaScript -->
                          <script language="JavaScript">
                          function newColor(idCell) {
                          if (document.all) eval('document.all.'+idCell+'.style.background = "#FFCC33"');
                          else eval('document.getElementById("' + idCell + '").style.background = "#FFCC33"');
                          }
                           
                          function backColor(idCell) {
                          if (document.all) eval('document.all.'+idCell+'.style.background = "#CCCCCC"');
                          else eval('document.getElementById("' + idCell + '").style.background = "#CCCCCC"');
                          }
                          </script>


                        7.06. Коментарии при наведение на ссылку
                        ExpandedWrap disabled
                          <html>
                             <head>
                                <script>
                                   function load(evt) {
                                      for(i=0; i<document.links.length; i++) {
                                         document.links[i].setAttribute("host",
                                            document.links[i].host);
                                      }
                                   }
                                </script>
                                <style>
                                   a {
                                      color: gray;
                                   }
                                   a:before {
                                      background-image: url("/img/external.link.gif");
                                      width: 20px;
                                      height: 20px;
                                   }
                                   a[host="internal.com"] {
                                      color: red;
                                   }
                                   a[host="internal.com"]:before {
                                      background-image: url("/img/internal.link.gif");
                                   }
                                </style>
                             </head>
                             <body onload="load(event);">
                             <ul>
                                <li>
                                   <a href="http://external.com/dsfsdf">http://external.com</a>
                                </li>
                                <li>
                                   <a href="http://internal.com/internal.html">/internal.html</a>
                                </li>
                             </ul>
                             </body>
                          </html>


                        7.07. Наведение на img
                        первый способ:
                        ExpandedWrap disabled
                          <HTML><HEAD>
                          <script language="JavaScript">
                          <!--
                          function MM_swapImgRestore() { //v3.0
                            var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++)
                          x.src=x.oSrc;
                          }
                          function MM_preloadImages() { //v3.0
                            var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
                              var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
                              if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
                          }
                          function MM_findObj(n, d) { //v3.0
                            var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
                              d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
                            if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++)
                          x=d.forms[i][n];
                            for(i=0;!x&&d.layers&&i<d.layers.length;i++)
                          x=MM_findObj(n,d.layers[i].document); return x;
                          }
                          function MM_swapImage() { //v3.0
                            var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array;
                          for(i=0;i<(a.length-2);i+=3)
                            if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc)
                          x.oSrc=x.src; x.src=a[i+2];}
                          }
                          //--> </script> </HEAD> <BODY onLoad="MM_preloadImages('1.gif','2.gif')">
                          <P ALIGN="CENTER">
                          <img name="Image1" alt="Text" border="0" src="1.gif"
                          onMouseOut="MM_swapImgRestore()"
                          onMouseOver="MM_swapImage('Image1','','2.gif',1)">
                          </P></BODY></HTML>

                        второй способ:
                        ExpandedWrap disabled
                          <a href="xlam.htm">
                          <img src="xlam1.gif" WIDTH="120" HEIGHT="24" alt="XLAM" border="0" onMouseover="this.src='xlam2.gif' " onMouseout="this.src='xlam1.gif'">
                          </a>

                        и там и там всё работает одинакого.

                        7.08. Проигрывание wav, наведением на объект
                        ExpandedWrap disabled
                          <HTML>
                          <BODY>
                          <SCRIPT LANGUAGE="JavaScript">
                          <!--
                          var strOver = "Data.wav";
                          var strClick = "Data.wav";
                          var a = new Array("never", "say", "die");
                           
                          for (var i = 0; i < a.length; i++)
                           document.writeln('<p><a href="#"'
                            + ' onmouseover="soundIt(false)"'
                            + ' onclick="soundIt(true)">'
                            + a[i] + '</a></p>');
                           
                          function soundIt(cause)
                          {
                           sounder.src = (cause ? strClick : strOver);
                          }
                          //-->
                          </SCRIPT>
                          <bgsound id="sounder"/>
                          </BODY>
                          </HTML>
                          </sample>
                        Сообщение отредактировано: fatalist -
                        Жизнь это игра - задумка хреновая, но графика обалденная...
                          1.18 Координаты курсора мышки при нажатии на кнопку
                          ExpandedWrap disabled
                            ltscript language="JavaScript">
                            <!--
                              window.captureEvents(Event.CLICK);
                              window.onclick= displayCoords;
                              function displayCoords(e) {
                              alert("x: " + e.pageX + " y: " + e.pageY);  }
                            // -->
                            </script>


                          1.19 При щелчке мыши не выезжает контекстное меню
                          ExpandedWrap disabled
                            document.oncontextmenu = function(){return false;};


                          1.20 Смена курсора мыши
                          ExpandedWrap disabled
                            function changeCursor(obj,i)
                            {
                             t=i;
                             if(i==0)t="DEFAULT"
                             else if(i==1)t="CROSSHAIR"
                             else if(i==2)t="HEND"
                             else if(i==3)t="MOVE"
                             else if(i==4)t="TEXT"
                             else if(i==5)t="WAIT"
                             obj.style.cursor=t;
                            }
                             
                            Изменение курсора над ссылкой
                            OnMouseOver="changeCursor(this,1)" href="my_file.htm">Ссылка</a>
                          Жизнь это игра - задумка хреновая, но графика обалденная...
                            1.15 Коментарии при наведение на ссылку не будет работаить в IE 6-
                            Отстреливаю каждого, кто называет ЯваСкрипт ДжаваСкриптом!
                            Так же люблю убивать тех, кто думает, что Java и JavaScript одно и то же.
                            Иногда еще вешаю тех, кто думает, что JScript и JavaScript одно и то же.
                              Пример Меню на JavaScript:

                              ExpandedWrap disabled
                                <script type="text/javascript">
                                var id_menu = new Array('sub_menu_1','sub_menu_2','sub_menu_3','sub_menu_4','sub_menu_5','sub_menu_6','sub_menu_7','sub_menu_8');
                                 
                                function allclose() {
                                        for (i=0; i < id_menu.length; i++){
                                                document.getElementById(id_menu[i]).style.display = "none";
                                        }
                                }
                                 
                                function openMenu(id){
                                        for (i=0; i < id_menu.length; i++){
                                                if (id != id_menu[i]){
                                                        document.getElementById(id_menu[i]).style.display = "none";
                                                }
                                        }
                                        if (document.getElementById(id).style.display == "block"){
                                                document.getElementById(id).style.display = "none";
                                        }else{
                                                document.getElementById(id).style.display = "block";
                                        }
                                }
                                </script>


                              ExpandedWrap disabled
                                <style type="text/css">
                                 
                                #menu_body{background:#81A192;width:200px}
                                #menu_body ul li{list-style-type:none;border-bottom:1px solid #fff;margin-left:-40px;padding-left:7px}
                                #menu_body ul li a{color:#fff;font-family:verdana,arial,sans-serif;text-decoration:none}
                                #menu_body ul li ul li{border:0;list-style-type:square;color:#fff;list-style-position:inside}
                                #menu_body ul li ul{border-top:1px solid #fff;margin-left:-7px;padding-left:50px}
                                 
                                </style>


                              ExpandedWrap disabled
                                </head>
                                 
                                <body onload="allclose()">
                                 
                                <div id="menu_body">
                                <ul>
                                  <li><a href="#" onclick="openMenu('sub_menu_1');return(false)">menu 1</a>
                                      <ul id="sub_menu_1">
                                          <li><a href="#">sub menu 1</a></li>
                                          <li><a href="#">sub menu 2</a></li>
                                          <li><a href="#">sub menu 3</a></li>
                                          <li><a href="#">sub menu 4</a></li>
                                          <li><a href="#">sub menu 5</a></li>
                                          <li><a href="#">sub menu 6</a></li>
                                          <li><a href="#">sub menu 7</a></li>
                                      </ul>
                                  </li>
                                  <li><a href="#" onclick="openMenu('sub_menu_2');return(false)">menu 2</a>
                                      <ul id="sub_menu_2">
                                          <li><a href="#">sub menu 1</a></li>
                                          <li><a href="#">sub menu 2</a></li>
                                          <li><a href="#">sub menu 3</a></li>
                                          <li><a href="#">sub menu 4</a></li>
                                          <li><a href="#">sub menu 5</a></li>
                                          <li><a href="#">sub menu 6</a></li>
                                          <li><a href="#">sub menu 7</a></li>
                                     </ul>
                                  </li>
                                  <li><a href="#" onclick="openMenu('sub_menu_3');return(false)">menu 3</a>
                                     <ul id="sub_menu_3">
                                          <li><a href="#">sub menu 1</a></li>
                                          <li><a href="#">sub menu 2</a></li>
                                          <li><a href="#">sub menu 3</a></li>
                                          <li><a href="#">sub menu 4</a></li>
                                          <li><a href="#">sub menu 5</a></li>
                                          <li><a href="#">sub menu 6</a></li>
                                          <li><a href="#">sub menu 7</a></li>
                                    </ul>
                                  </li>
                                  <li><a href="#" onclick="openMenu('sub_menu_4');return(false)">menu 4</a>
                                    <ul id="sub_menu_4">
                                          <li><a href="#">sub menu 1</a></li>
                                          <li><a href="#">sub menu 2</a></li>
                                          <li><a href="#">sub menu 3</a></li>
                                          <li><a href="#">sub menu 4</a></li>
                                          <li><a href="#">sub menu 5</a></li>
                                          <li><a href="#">sub menu 6</a></li>
                                          <li><a href="#">sub menu 7</a></li>
                                    </ul>
                                 </li>
                                 <li><a href="#" onclick="openMenu('sub_menu_5');return(false)">menu 5</a>
                                    <ul id="sub_menu_5">
                                          <li><a href="#">sub menu 1</a></li>
                                          <li><a href="#">sub menu 2</a></li>
                                          <li><a href="#">sub menu 3</a></li>
                                                  <li><a href="#">sub menu 4</a></li>
                                                  <li><a href="#">sub menu 5</a></li>
                                                  <li><a href="#">sub menu 6</a></li>
                                          <li><a href="#">sub menu 7</a></li>
                                        </ul>
                                  </li>
                                <li><a href="#" onclick="openMenu('sub_menu_6');return(false)">menu 6</a>
                                    <ul id="sub_menu_6">
                                         <li><a href="#">sub menu 1</a></li>
                                         <li><a href="#">sub menu 2</a></li>
                                         <li><a href="#">sub menu 3</a></li>
                                         <li><a href="#">sub menu 4</a></li>
                                         <li><a href="#">sub menu 5</a></li>
                                         <li><a href="#">sub menu 6</a></li>
                                         <li><a href="#">sub menu 7</a></li>
                                   </ul>
                                </li>
                                <li><a href="#" onclick="openMenu('sub_menu_7');return(false)">menu 7</a>
                                    <ul id="sub_menu_7">
                                         <li><a href="#">sub menu 1</a></li>
                                         <li><a href="#">sub menu 2</a></li>
                                         <li><a href="#">sub menu 3</a></li>
                                         <li><a href="#">sub menu 4</a></li>
                                         <li><a href="#">sub menu 5</a></li>
                                         <li><a href="#">sub menu 6</a></li>
                                         <li><a href="#">sub menu 7</a></li>
                                   </ul>
                                </li>
                                <li><a href="#" onclick="openMenu('sub_menu_8');return(false)">menu 8</a>
                                     <ul id="sub_menu_8">
                                         <li><a href="#">sub menu 1</a></li>
                                         <li><a href="#">sub menu 2</a></li>
                                         <li><a href="#">sub menu 3</a></li>
                                         <li><a href="#">sub menu 4</a></li>
                                         <li><a href="#">sub menu 5</a></li>
                                         <li><a href="#">sub menu 6</a></li>
                                         <li><a href="#">sub menu 7</a></li>
                                      </ul>
                                </li>
                                </ul>
                                </div>
                                </body>

                              Реализовывайте это меню под себя (горизонтально и т.д.)
                              Жизнь это игра - задумка хреновая, но графика обалденная...
                                Core JavaScript Reference v.1.5 [content]
                                Core JavaScript Reference v.1.5 [index]
                                ---
                                CSS2 [content]
                                CSS2 [index]
                                ---

                                Функция округления числа до нужной степени и обрезания буковок

                                ExpandedWrap disabled
                                  function my_round (obj, stepen)
                                    {
                                      some_num = obj.value.replace (/[^0-9.]/gi, '');
                                    if (stepen == 0)
                                    {
                                              if (!(isNaN(parseInt(some_num, 10))))
                                              {
                                            res_ = (some_num * Math.pow(10, stepen));
                                            res_ = Math.round (res_);
                                            res_ = (res_ / Math.pow(10, stepen));
                                              }
                                    }
                                    else
                                    if (stepen != 0)
                                    {
                                            if (!(isNaN(parseFloat(some_num))))
                                              {
                                            res_ = (some_num * Math.pow (10, stepen));
                                            res_ = Math.round (res_);
                                            res_ = (res_ / Math.pow (10, stepen));
                                              }
                                    }
                                    
                                    return res_;
                                    }


                                Вызов:
                                ExpandedWrap disabled
                                  <input type = "text" id = "txt3" value = "12345.3213123" onChange = "my_round (this, 0);">


                                Суть:
                                my_round (параметр1, параметр2);
                                где:
                                параметр1 - что округляем,
                                параметр2 - до какой степени. Т.е.: если нужно получить на выходе целочисленное округленное число, то параметр2 = 0, иначе - округляем до нужной степени округления.
                                0 пользователей читают эту тему (0 гостей и 0 скрытых пользователей)
                                0 пользователей:


                                Рейтинг@Mail.ru
                                [ Script Execution time: 0,2171 ]   [ 17 queries used ]   [ Generated: 20.07.19, 22:06 GMT ]