Показать сообщение отдельно
  #10 (permalink)  
Старый 17.06.2014, 14:32
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,109

Webtest,

<!DOCTYPE HTML>

<html>

<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">.forma{
    text-align:center;
    width:400px;
    padding:20px;
    background:#fefefe;
    border:1px solid #000;
    border-radius:10px;
  }

  .open_form{
    border:1px solid #fc5f00;
    border-radius:20px;
    font-size:20px;
    padding:10px 25px;
    background:#fa9050;
    box-shadow:inset 0 1px 5px rgba(255,255,255,.6),inset 0 -15px 10px 5px #fc5f00,0 1px 2px rgba(0,0,0,.2);
    text-shadow:1px 1px 0px #cc4f03;
    width:250px;
    margin:0 auto;
    cursor:pointer;
  }

  .open_form:hover{
    background:#fa9050;
    box-shadow:inset 0 1px 5px rgba(255,255,255,.6),inset 0 -15px 5px 0px #fc5f00,0 1px 2px rgba(0,0,0,.2);
  }

  label:hover .sama_forma{
    border:1px solid #fc5f00;
    border-radius:20px;
    font-size:20px;
    padding:10px 25px;
    background:#fa9050;
    box-shadow:inset 0 1px 5px rgba(255,255,255,.6),inset 0 -15px 10px 5px #fc5f00,0 1px 2px rgba(0,0,0,.2);
    text-shadow:1px 1px 0px #cc4f03;
    width:250px;
    margin:0 auto;
    cursor:pointer;
    height:50px;
    transition:all 2s 0.5s;
    -moz-transition:all 2s 0.5s;
    -webkit-transition:all 2s 0.5s;
    -o-transition:all 2s 0.5s;
  }

  .sama_forma{
    background:#fa9050;
    height:0px;
    margin-top:0px;
    overflow:hidden;
  }
  </style>
</head>

<body>
 <div class="forma">
<label><div disabled class="open_form">
		Выберите фон
		</div>
<div class="sama_forma" >
    <button class="color" id="red" name="button" value="red" onclick='change_color(this)'></button>
				<button class="color" id="orange" name="button" value="orange" onclick='change_color(this)'></button>
				<button class="color" id="yellow" name="button" value="yellow" onclick='change_color(this)'></button>
				<button class="color" id="green" name="button" value="green" onclick='change_color(this)'></button>
				<button class="color" id="blue" name="button" value="blue" onclick='change_color(this)'></button>
				<button class="color" id="lightBlue" name="button" value="lightBlue" onclick='change_color(this)'></button>
				<button class="color" id="purple" name="button" value="purple" onclick='change_color(this)'></button>
				<button class="color" id="gray" name="button" value="gray" onclick='change_color(this)'></button>
				<button class="color" id="brown" name="button" value="brown" onclick='change_color(this)'></button>
				<button class="color" id="white" name="button" value="white" onclick='change_color(this)'></button>
</div>   </label>

</div>


</body>

</html>
Ответить с цитированием