Yui: различия между версиями
Содержимое удалено Содержимое добавлено
Moriline (обсуждение | вклад) Нет описания правки |
Moriline (обсуждение | вклад) Нет описания правки |
||
Строка 850:
<h3><span>Dom (Работа с DOM)</span></h3>
'''Определение и установка новых координат обьекта:'''
<source lang="javascript">
<!-- 1 -->
<script type="text/javascript">▼
<link rel="stylesheet" type="text/css" href="yui/build/fonts/fonts-min.css" />
<script type="text/javascript" src="yui/build/yahoo-dom-event/yahoo-dom-event.js"></script>
<style type="text/css">
#demo {
background-color:#00f;
height:10px;
width:10px;
margin-bottom:1em;
}
</style>
<!-- 1 -->
<!-- 2 -->
<style type="text/css">
#foo {width:10px; height:10px;background-color:#00f;}
</style>
<div id="foo"></div>
<script>
(function() {
var move = function(e) {
YAHOO.util.Dom.setXY('foo', YAHOO.util.Event.getXY(e));
};
YAHOO.util.Event.on(document, "click", move);
})();
</script>
<!-- 2 -->
</source>
'''Нахождение элементов по их классу:'''
<source lang="javascript">
<!-- 1 -->
<link rel="stylesheet" type="text/css" href="yui/build/fonts/fonts-min.css" />
<script type="text/javascript" src="yui/build/yahoo-dom-event/yahoo-dom-event.js"></script>
<style type="text/css">
#foo {
margin-bottom:1em;
}
</style>
<!-- 1 -->
<!-- 2 -->
<div class="bar">div class="bar"</div>
<div class="bar-baz">div class="bar-baz"</div>
<div class="bar ">div class="bar "</div>
<div class=" bar ">div class=" bar "</div>
<div class="bar baz">div class=" bar baz"</div>
<div class="bar2 baz">div class=" bar2 baz"</div>
<div class="foo">div class="foo"</div>
<div class="foo" id="bar">div class="foo" id="bar"</div>
<div class="foo bar baz">div class="foo bar baz"</div>
<p class="bar">p class="bar"</p>
<button id="demo-run">run</button>
▲<script type="text/javascript">
(function() {
var getByClass = function(e) {
alert('found: ' + YAHOO.util.Dom.getElementsByClassName('bar', 'div').length + ' elements');
};
YAHOO.util.Event.on('demo-run', 'click', getByClass);
})();
</script>
<!-- 2 -->
</source>
| |||