04.04.2011, 16:09
|
Аспирант
|
|
Регистрация: 20.08.2010
Сообщений: 54
|
|
"Живые" элементы
Всем доброго времени суток. Есть скрипт, который выводит на первый чекбокс подсказку и если человек скролит страницу вниз и если чекбокс скрывается из видимости, то подсказка передвигается на следующий видимый чекбокс. Подскажите, пожалуйста, если создаются новые чекбоксы то как к ним привязать это? Например, если на страницу пришли новые чекбоксы через аякс. Пробовал .live(), но по видимому к скролу не применяется...Спасибо.
$(document).ready(function(){
var position = $('.checkbox-check').offset();
var top = position.top;
$("#tooltip-checkbox-check").css("top",top + 20).css("left","879px").show();
});
window.onscroll = scrollEvent;
function scrollEvent() {
var i;
var j = $(".checkbox-check").length;
for (i=0;i<j;i++)
{
var el = $(".checkbox-check")[i];
var br = el.getBoundingClientRect();
var top_el = br.top;
if (i == 0 && top_el > 0)
{
var position_next = $('.checkbox-check').eq(0).offset();
if (position_next != null)
{
var top = position_next.top + 17;
$("#tooltip-checkbox-check").css("top", + top);
}
}
if (top_el <= 0)
{
var position_next = $('.checkbox-check').eq(i+1).offset();
if (position_next != null)
{
var top = position_next.top + 17;
$("#tooltip-checkbox-check").css("top", + top);
}
}
}
}
Последний раз редактировалось Johny, 04.04.2011 в 17:31.
|
|
05.04.2011, 10:42
|
Аспирант
|
|
Регистрация: 20.08.2010
Сообщений: 54
|
|
Иными словами как можно реализовать live() в связке с scroll?И возможно ли вообще это?Гугл выдает множество похожих запросов, но нигде нет решения.
|
|
05.04.2011, 11:54
|
Профессор
|
|
Регистрация: 16.03.2010
Сообщений: 1,618
|
|
Говнокод.
Особенно смешное место вот это:
var j = $(".checkbox-check").length;
for (i=0;i<j;i++){
var el = $(".checkbox-check")[i];
Обратите внимание, как автор ускоряет работу скрипта, вынеся в отдельную переменную длину выборки, а потом делает каждый раз новые выборки
Johny, это раздел "Общие вопросы Javascript". Для jQuery есть свой раздел. Если ума не хватает даже правильно разместить тему, займись чем-нибудь по-проще, чем программирование.
|
|
05.04.2011, 13:29
|
Аспирант
|
|
Регистрация: 20.08.2010
Сообщений: 54
|
|
Sweet, спасибо за критику, хотя и жёсткую Немного модифицоровал скрипт. Буду очень признателен если сможете подсказать как можно ещё его улучшить. Спасибо.
$(function(){
var j = $(".checkbox-check").length;
var els = new Array();
for (i=0;i<j;i++)
{
els[i] = $(".checkbox-check")[i];
}
window.onscroll = scrollEvent;
function scrollEvent() {
var i;
for (i=0;i<j;i++)
{
var el = $(els)[i];
var br = el.getBoundingClientRect();
var top_el = br.top;
if (i == 0 && top_el > 0)
{
var position_next = $(els).eq(0).offset();
if (position_next != null)
{
var top = position_next.top + 17;
$("#tooltip-checkbox-check").css("top", + top);
}
}
if (top_el <= 0)
{
var position_next = $(els).eq(i+1).offset();
if (position_next != null)
{
var top = position_next.top + 17;
$("#tooltip-checkbox-check").css("top", + top);
}
}
}
}
});
|
|
05.04.2011, 13:31
|
Особый гость
|
|
Регистрация: 02.04.2010
Сообщений: 4,260
|
|
Сообщение от Johny
|
var el = $(".checkbox-check")[i];
|
кстати, на этом шаге jQuery взбрыкнет и попросит сделать так:
var el = $(".checkbox-check").eq(i);
или так:
var el = $('.checkbox-check:eq('+i+')');
|
|
05.04.2011, 13:45
|
Аспирант
|
|
Регистрация: 20.08.2010
Сообщений: 54
|
|
monolithed, спасибо, но по совету Sweet я решил сразу вытащить все элементы, соответственно и скорость увеличилась где-то в 2 раза. Теперь мне стало интересно как можно было бы по-другому всё это сделать.
|
|
07.04.2011, 06:43
|
|
|
|
Регистрация: 27.12.2008
Сообщений: 4,201
|
|
Сообщение от monolithed
|
var el = $(".checkbox-check")[i];
кстати, на этом шаге jQuery взбрыкнет и попросит сделать так:
var el = $(".checkbox-check").eq(i);
или так:
var el = $('.checkbox-check:eq('+i+')');
|
чего это взбрыкнет? Обращение по индексу - это то же самое что метод get. А там потом getBoundingClientRect идет, так что взбрыкнет как раз с eq
|
|
07.04.2011, 08:35
|
|
Профессор
|
|
Регистрация: 27.05.2010
Сообщений: 33,109
|
|
Вариант ...
<!DOCTYPE html>
<html>
<head>
<title></title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js"></script>
<script type="text/javascript">
$(function () {
var t = '<span class="hello">hello</span>';
$(window).scroll(function() {
$('.hello').remove();
var top = $(document).scrollTop();
$(':checkbox').each(function() {
var p = $(this).position();
if(p.top+8>top) {$(this).after(t); return false }
})});
$(window).scroll();
});
</script>
</head>
<body>
<input type="checkbox" name="" /><br />
<input type="checkbox" name="" /><br />
<input type="checkbox" name="" /><br />
<input type="checkbox" name="" /><br />
<input type="checkbox" name="" /><br />
<input type="checkbox" name="" /><br />
<input type="checkbox" name="" /><br />
<input type="checkbox" name="" /><br />
<input type="checkbox" name="" /><br />
<input type="checkbox" name="" /><br />
<input type="checkbox" name="" /><br />
<input type="checkbox" name="" /><br />
<input type="checkbox" name="" /><br />
<input type="checkbox" name="" /><br />
<input type="checkbox" name="" /><br />
<input type="checkbox" name="" /><br />
<input type="checkbox" name="" /><br />
<input type="checkbox" name="" /><br />
<input type="checkbox" name="" /><br />
<input type="checkbox" name="" /><br />
<input type="checkbox" name="" /><br />
<input type="checkbox" name="" /><br />
<input type="checkbox" name="" /><br />
<input type="checkbox" name="" /><br />
<input type="checkbox" name="" /><br />
<input type="checkbox" name="" /><br />
<input type="checkbox" name="" /><br />
<input type="checkbox" name="" /><br />
<input type="checkbox" name="" /><br />
<input type="checkbox" name="" /><br />
<input type="checkbox" name="" /><br />
<input type="checkbox" name="" /><br />
<input type="checkbox" name="" /><br />
<input type="checkbox" name="" /><br />
</body>
</html>
|
|
07.04.2011, 09:28
|
|
|
|
Регистрация: 27.12.2008
Сообщений: 4,201
|
|
а вообще задача какая-то, из области теоретического бессознательного. Раз на то пошло, мне больше нравится идея мертвых элементов
<input disabled>
|
|
07.04.2011, 12:57
|
Аспирант
|
|
Регистрация: 20.08.2010
Сообщений: 54
|
|
Всем спасибо и отдельно рони. Всё, как обычно, оказалось намного проще. Отсается только один вопрос: неужели до сих пор нельзя никак связать live() и scroll? Этот вопрос уже задавал в разделе jquery. Глухо. На сайте jquery тикет с такой же проблемой был закрыт 2 года назад, сказали что в разработке. Неужели до сих пор нет альтернатив?
|
|
|
|