-

  • Android ( ) (22)
  • FAQ (14)
  • Info (140)
  • (81)
  •    _BMW (43)
  •    _Ferrari (15)
  •    _FORD (10)
  •    _Mercedes-benz (10)
  •    _ (10)
  •    _ (1)
  •    _ (22)
  •    _ (71)
  •    _ (53)
  •    _ (16)
  •    _ (2)
  •    _ (6)
  •    _ (12)
  • (823)
  •     (588)
  •    _ (97)
  •     (138)
  • _ (537)
  •    _ (152)
  •    _UFO (106)
  •     (110)
  •    _ (175)
  • _ (61)
  • __ (28)
  • _ (99)
  • _ (876)
  • _ (19)
  • (5)
  •    _ (5)
  • (1336)
  •    __ (690)
  •    _ (201)
  •    _ (69)
  •    _ (376)
  • _ (37)
  • _ (7)
  • __ (60)
  • (51)
  • (2)
  • (43)
  • (16)
  • (7)
  • (455)
  • _ (135)
  • (3)
  • (24)
  • (58)
  • (54)
  • (23)
  • (148)
  • (7)
  • (327)
  •    _ (65)
  •    __ (44)
  •    _ (1)
  •    __5000 (135)
  •    _70 (83)
  • (6)
  • (8)

 -

 -

 -

( Notepad): - (0)

( Notepad): (. Notepad) — ...

- (0)

1) 2) blog.ru , 3) 4)

... - (1)

... ? , ,...

- (0)

  ...

Help - (1)

  , ? ...

 -

: 0 (0)
: 0 (0)
: 350 (0)
: 200 (1)

 -

    2015
2015
09:46 14.04.2015
: 5
    2014
2014
20:36 22.08.2014
: 7
    2013
2013
18:05 26.08.2013
: 8

 -

 -

   Aleksey_Malysh

 - e-mail

 

 -

 -

 LiveInternet.ru:
: 26.05.2010
: 4842
: 96
: 5586

:

(3)

, 29 2013 . 07:01 +
. ? . , . . , HTML- . , «», , , «». () , , , . . , , , HTML- . !

__

:  
(0)

, 25 2013 . 12:11 +

 

Aleksey_Malysh

 

, .

HTML–

Echo<<<_START  // !

<divclass="mm16b">                 

    <div class="mm16">

      <li><a id="mm16ta1" onclick="Vida16('mm16a1', 'mm16ta1')" href="#"></a></li>      

      <li><a id="mm16ta2" onclick="Vida16('mm16a2', 'mm16ta2')" href="#"></a></li>   

      <li><a id="mm16ta3" onclick="Vida16('mm16a3', 'mm16ta3')" href="#"></a></li>

      <li><a id="mm16ta4" onclick="Vida16('mm16a4', 'mm16ta4')" href="#"></a></li>

    </div>   

   <div id="mm16a1" class="mm16a1">

        <li><a href="#">11</a></li>

        <li><a href="#">22</a></li>

        <li><a href="#">33</a></li>

        <li><a href="#">44</a></li>

        <li><a href="#">55</a></li>

        <li><a href="#">66</a></li>

        <li><a href="#">77</a></li>

        <li><a href="#">88</a></li>       

   </div>  

   <div id="mm16a2" class="mm16a2"> 

        <li><a href="#">11</a></li>

        <li><a href="#">22</a></li>

        <li><a href="#">33</a></li>

        <li><a href="#">44</a></li>

        <li><a href="#">55</a></li>

        <li><a href="#">66</a></li>

        <li><a href="#">77</a></li>

        <li><a href="#">88</a></li>       

   </div>

   <div id="mm16a3" class="mm16a3">

        <li><a href="#">11</a></li>

        <li><a href="#">22</a></li>

        <li><a href="#">33</a></li>

        <li><a href="#">44</a></li>

        <li><a href="#">55</a></li>

        <li><a href="#">66</a></li>

        <li><a href="#">77</a></li>

        <li><a href="#">88</a></li>       

   </div>

   <div id="mm16a4" class="mm16a4">

        <li><a href="#">11</a></li>

        <li><a href="#">22</a></li>

        <li><a href="#">33</a></li>

        <li><a href="#">44</a></li>

        <li><a href="#">55</a></li>

        <li><a href="#">66</a></li>

        <li><a href="#">77</a></li>

        <li><a href="#">88</a></li>       

   </div> 

</div>

_START// !

 

FILE.CSS –

.mm16b {

            height: 65px;

            width: 950px;

            display: block;

            font-family: arial;

            font-size: 14px;

            position: relative;

            top: auto;

            left: auto;

            background-color: #0F0;

}

#mm16ta1 {

            padding: 0px 10px 20px 10px;

            background-color: #999;

}

#mm16ta2 {

            background-color: #333;

            padding: 0px 10px 20px 10px;

}

#mm16ta3 {

            background-color: #333;

            padding: 0px 10px 20px 10px;

}

#mm16ta4 {

            background-color: #333;

            padding: 0px 10px 20px 10px;

}

.mm16 {

            width: 938px;

            height: auto;

            position: relative;

            top: 2px;

            left: auto;

}

.mm16 li {

            FLOAT: left;

            MARGIN: 0px 5px 0px 5px;

            WIDTH: auto;

            font-size: x-large;

            padding: 0;

            display: inline;

}

.mm16 li A:link {

            COLOR: #CFF;

            TEXT-DECORATION: none;

}

.mm16 li A:visited {

            text-decoration: none;

            color: #CFF;

}

.mm16 li A:hover {

            background-color: #FFF;

            text-decoration: underline;

            color: #F00;

}

.mm16 li A:focus {

            text-decoration: none;

            color: #CFF;

}

#mm16a1 {

            visibility: visible;

 

}

.mm16a1 {

            left: 5px;

            font-size: large;

            top: 38px;

            width: 940px;

            background-color: #999;

            float: left;

            position: absolute;

}

.mm16a1 li {

            FLOAT: left;

            MARGIN: 0px 5px 0px 5px;

            WIDTH: auto;

            font-size: large;

            display: inline;

            padding: 0px 5px 0px 5px;

}

#mm16a2 {

            visibility: hidden;

 

}

.mm16a2 {

            left: 5px;

            font-size: large;

            top: 38px;

            width: 940px;

            position: absolute;

            background-color: #999;

            clear: both;

}

.mm16a2 li {

            FLOAT: left;

            MARGIN: 0px 5px 0px 5px;

            WIDTH: auto;

            font-size: large;

            display: inline;

            padding: 0px 5px 0px 5px;

}

#mm16a3 {

            visibility: hidden;

}

.mm16a3 {

            font-size: large;

            left: 5px;

            top: 38px;

            width: 940px;

            clear: both;

            position: absolute;

            background-color: #999;

}

.mm16a3 li {

            FLOAT: left;

            MARGIN: 0px 5px 0px 5px;

            WIDTH: auto;

            font-size: large;

            display: inline;

            padding: 0px 5px 0px 5px;

}

#mm16a4 {

            visibility: hidden;

 

}

.mm16a4 {

            font-size: large;

            left: 5px;

            top: 38px;

            width: 940px;

            clear: both;

            position: absolute;

            background-color: #999;

}

.mm16a4 li {

            FLOAT: left;

            MARGIN: 0px 5px 0px 5px;

            WIDTH: auto;

            font-size: large;

            display: inline;

            padding: 0px 5px 0px 5px;

}

 

.mm16a1 li A:link , .mm16a2 li A:link, .mm16a3 li A:link, .mm16a4 li A:link {

            COLOR: #FF0;

            TEXT-DECORATION: none

}

.mm16a1 li A:visited , .mm16a2 li A:visited, .mm16a3 li A:visited, .mm16a4 li A:visited {

            text-decoration: none;

            color: #FF0;

}

.mm16a1 li A:hover , .mm16a2 li A:hover, .mm16a3 li A:hover, .mm16a4 li A:hover {

            background-color: Aqua;

            text-decoration: underline;

            color: #F00;

}

.mm16a1 li A:focus, .mm16a2 li A:focus, .mm16a3 li A:focus, .mm16a4 li A:focus {

            background-color: Aqua;

            text-decoration: underline;

            color: #F00;

}

 

FILE.JS –

function Vida16(ida, idc)

{

  a1='mm16a1';

  a2='mm16a2';

  a3='mm16a3';

  a4='mm16a4';

  s(a1).style.visibility='hidden';

  s(a2).style.visibility='hidden';

  s(a3).style.visibility='hidden';

  s(a4).style.visibility='hidden';

  s(ida).style.visibility='visible';

  t1='mm16ta1';

  t2='mm16ta2';

  t3='mm16ta3';

  t4='mm16ta4';

  col='#333';

  s(t1).style.backgroundColor=col;

  s(t2).style.backgroundColor=col;

  s(t3).style.backgroundColor=col;

  s(t4).style.backgroundColor=col;

  s(idc).style.backgroundColor='#999';

  return 1;

}

 

 function s(e)

{

   return document.getElementById(e);

}

 

 



:  

 : [1]