jeena/en.javascript.info
1
0
Fork 0
Code Issues Pull requests Projects Packages Wiki Activity Actions

init

Browse source
This commit is contained in:
Ilya Kantor 2014-10-26 22:10:13 +03:00
parent 06f61d8ce8
commit f301cb744d
2271 changed files with 103162 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

51
02-ui/05-widgets/05-custom-events/03-custom-select/solution/index.html Executable file
View file

@ -0,0 +1,51 @@
<!DOCTYPE HTML>
<html>
<head>
<title>Селект</title>
<script src='http://code.jquery.com/jquery.min.js'></script>
<link rel="stylesheet" href="customselect.css"/>
<script src="customselect.js"></script>
</head>
<body>
<div>Последний результат: <span id="result">...</span></div>
<div id="animal-select" class="customselect">
<div class="customselect-title">Выберите</div>
<ol class="customselect-options">
<!-- значение хранится в свойстве data-value -->
<li data-value="bird">Птицы</li>
<li data-value="fish">Рыбы</li>
<li data-value="animal">Звери</li>
<li data-value="dino">Динозавры</li>
<li data-value="simplest">Одноклеточные</li>
</ol>
</div>
<div id="food-select" class="customselect">
<div class="customselect-title">Выберите</div>
<ol class="customselect-options">
<li data-value="carnivore">Плотоядные</li>
<li data-value="herbivore">Травоядные</li>
<li data-value="omnivore">Всеядные</li>
</ol>
</div>
<script>
var animalSelect = new CustomSelect({
elem: $('#animal-select')
});
var foodSelect = new CustomSelect({
elem: $('#food-select')
});
$([animalSelect, foodSelect]).on('select', function (event) {
$('#result').html(event.value)
});
</script>
</body>
</html>