Показать сообщение отдельно
  #6 (permalink)  
Старый 03.06.2012, 12:25
без статуса
Отправить личное сообщение для Deff Посмотреть профиль Найти все сообщения от Deff
 
Регистрация: 25.05.2012
Сообщений: 8,219

olahanz,
<html>
	<head>
	    <meta charset="utf-8">
	    <title>…</title>
<style type="text/css">
#cont{width:70px;margin:5% auto;position:relative;height:70px;border:1px solid #000;}
#red,#green,#blue,#yellow{height: 40px;width: 40px;left: 10px;position: absolute;}
#red{background-color:red;left: 0;top:0}
#green{background-color:green;left:10px;top:10px}
#blue{background-color:blue;left: 20px;top:20px}
#yellow{background-color:yellow;left: 30px;top:30px}
#sel {position:absolute;left:0px;top:67px}</style>

<script type="text/javascript" src="http://yandex.st/jquery/1.4.4/jquery.min.js"></script>
<script type="text/javascript">
  function showTR () {
    $("#Show-Hid div[id]").show();
    $("#Show-Hid #"+$('#sel1 option:selected').text()).hide()
  }
</script>

</head>
<body>
<div id="cont">
  <div id="Show-Hid">
    <div id="red"></div>
    <div id="green"></div>
    <div id="blue"></div>
    <div id="yellow"></div>
  </div>
    <div id="sel">
      <select name="menu" id="sel1" onchange="showTR();">
        <option selected="selected" value = "0">Choose a color</option>
        <option value = "1">Red</option>
        <option value = "2">Green</option>
        <option value = "3">Blue</option>
        <option value = "4">Yellow</option>
      </select>

  </div>
</div>

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