<!DOCTYPE HTML> <html> <head> <style> input[name='chb-agree']:disabled{ outline: 1px solid red; } </style> <script src="http://code.jquery.com/jquery-latest.js"></script> <script> $(document).ready(function(){ $("input[name='chb-agree']").attr('disabled',true).removeAttr('id') var tarea=$("#txt-sign") setTimeout( function(){tarea.scrollTop(3000);},20) var tareaScroll; var timerscroll; setTimeout( function(){ tareaScroll = tarea.scrollTop(); //alert(tareaScroll); tarea.scrollTop(0); $("#txt-sign").bind('scroll',function () { clearTimeout(timerscroll); timerscroll=setTimeout( function(){ // очистка чрезмерных срабатываний; if(tarea.scrollTop()>=tareaScroll-12) { $("input[name='chb-agree']").removeAttr('disabled').attr('id','chb-agree'); $("#txt-sign").ubind('scroll'); } },20) }); },20) }); </script> </head> <body> <form action=""> <div class="verification-form-wrap sign"> <textarea id="txt-sign" name="txt-sign" cols="70" rows="10"> TEMPORARY REGISTRATION AGREEMENT 1. I have read andagree to Siberian Health Compensation Plan and Siberian Health products andservices as set forth in official Siberian Health literature ..................................................................... ..................................................................... ..................................................................... ..................................................................... ..................................................................... ..................................................................... ..................................................................... ..................................................................... ..................................................................... ..................................................................... ..................................................................... ..................................................................... ..................................................................... ..................................................................... ..................................................................... ..................................................................... ..................................................................... ..................................................................... ..................................................................... ..................................................................... </textarea> <div class="chb-wrapper"> <input type="checkbox" id="chb-agree" name="chb-agree" /> <label for="chb-agree" class="lb-agree">I accept all terms and conditions of the contact (please read contract)</label> </div> </form> </body> </html> |
Deff, можно ведь проще:
http://jsfiddle.net/vsEuc/ |
a_l,
Cимпатично( чот не пришёл такой путь Да , нужно отнять десяток пиксел от высоты if($(this)[0].scrollTop + $(this).height() >= $(this)[0].scrollHeight-12) { у некоторых браузов скролл чуть менее высоты |
Возможно Ваш элегантней... сплю уже
<!DOCTYPE html> <html> <head> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <title> - jsFiddle demo</title> <style> input[name='galochka']:disabled{ outline: 1px solid red; } </style> <script type="text/javascript" src="http://code.jquery.com/jquery-1.9.0.js"></script> <link rel="stylesheet" type="text/css" href="/css/normalize.css"> <link rel="stylesheet" type="text/css" href="/css/result-light.css"> <style type="text/css"> textarea{ width:300px; height:100px; display:block; } </style> <script type="text/javascript">//<![CDATA[ $(window).load(function(){ $("input[name=galochka]").attr("disabled", true); $("textarea").scroll(function() { if($(this)[0].scrollTop + $(this).height() >= $(this)[0].scrollHeight-10) { $('input[name=galochka]').removeAttr("disabled"); } }); });//]]> </script> </head> <body style=""> <textarea>Очень длинное соглашение! Очень длинное соглашение! Очень длинное соглашение! Очень длинное соглашение! Очень длинное соглашение! Очень длинное соглашение! Очень длинное соглашение! Очень длинное соглашение! Очень длинное соглашение! Очень длинное соглашение! Очень длинное соглашение! Очень длинное соглашение! </textarea> <input type="checkbox" name="galochka"> </body> </html> Вот тут без отъёма 10 пиксел не сработало Но всё одно - данный Ваш код элегантней! |
a_l,
Нашел синхронную оплошку в обоих кодах: При растягивании textarea до лишения скролла - естественно событие не срабатывает и checkbox никогда не раздизаблится Нун таймаутом изредка проверять высоту textarea и высоту контента |
Цитата:
textarea{ resize: none; } |
Цитата:
|
Да, ресайз должен быть запрещен.
Я вчера стал писать по-своему как-то, но a_l действительно предложил элегантное решение, посему использовал его. Спасибо a_l и deff за помощь. Огромное. |
Часовой пояс GMT +3, время: 07:45. |