"Живые" элементы
Всем доброго времени суток. Есть скрипт, который выводит на первый чекбокс подсказку и если человек скролит страницу вниз и если чекбокс скрывается из видимости, то подсказка передвигается на следующий видимый чекбокс. Подскажите, пожалуйста, если создаются новые чекбоксы то как к ним привязать это? Например, если на страницу пришли новые чекбоксы через аякс. Пробовал .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); } } } } |
Иными словами как можно реализовать live() в связке с scroll?И возможно ли вообще это?Гугл выдает множество похожих запросов, но нигде нет решения.
|
Говнокод.
Особенно смешное место вот это: var j = $(".checkbox-check").length; for (i=0;i<j;i++){ var el = $(".checkbox-check")[i];Обратите внимание, как автор ускоряет работу скрипта, вынеся в отдельную переменную длину выборки, а потом делает каждый раз новые выборки:lol: Johny, это раздел "Общие вопросы Javascript". Для jQuery есть свой раздел. Если ума не хватает даже правильно разместить тему, займись чем-нибудь по-проще, чем программирование. |
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); } } } } }); |
Цитата:
var el = $(".checkbox-check").eq(i); или так: var el = $('.checkbox-check:eq('+i+')'); |
monolithed, спасибо, но по совету Sweet я решил сразу вытащить все элементы, соответственно и скорость увеличилась где-то в 2 раза. Теперь мне стало интересно как можно было бы по-другому всё это сделать.
|
Цитата:
|
Вариант ...
<!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> |
а вообще задача какая-то, из области теоретического бессознательного. Раз на то пошло, мне больше нравится идея мертвых элементов :)
<input disabled> |
Всем спасибо и отдельно рони. Всё, как обычно, оказалось намного проще. Отсается только один вопрос: неужели до сих пор нельзя никак связать live() и scroll? Этот вопрос уже задавал в разделе jquery. Глухо. На сайте jquery тикет с такой же проблемой был закрыт 2 года назад, сказали что в разработке. Неужели до сих пор нет альтернатив?
|
Часовой пояс GMT +3, время: 12:42. |