SIC
-
Posts
8 -
Joined
-
Last visited
SIC's Achievements
Explorer (1/14)
0
Reputation
-
Логичный вопрос. Есть две причины: 1. Это удобнее выбора в простом выпадающем списке и на многих сайтах это реализовано. Пример форма создания лота на молотке, кто зарегистрирован может сам посомтреть, для остальных <a href="http://fastpic.ru/view/44/2012/1016/bab934f1cddb09f51a75eb5d07f5e26d.jpg.html" target="_blank">скрин</a>. Кстати там кнопки не работают и выбор осуществляется только по одному пункту, но отдебажить код, который это позволяет сделать мне не удалось. Может кто-то уже сталкивался с такой задачей и знает как это сделано. 2. Есть утверждённый проект сайта, есть первая тестовая версия и результаты проведённого тестирования, которое показывает, что простыми селектами выбирать категорию труднее для юзера, соответсвенно есть и поправки в проекте, которые говорят, что именно так должен выглядить выбор. prevenDefault я так понимаю отменит действие по-умолчанию, а именно действие по выбору option. В любом случае я пробовал его не работает, пункты по-прежнему выбираются вместе.
-
Здравствуйте, уважаемые форумчане. Столкнулся с проблемой - никак не удаётся отключить множественный выбор на селекте, если он отображается как multiple. Я написал скрипт, который может просто отменить предыдущий выбор и оставить только новый, т.е. своей цели я добился, но отмену легко заметить, т.к. на экране какое-то мгновение выбрано сразу два пункта. Поэтому я пошёл с другой стороны и решил вообще запретить пользоваться кнопками ctrl и shift над такими селектами, но не тут-то было. В общем примеры: html код: <select id="multi1" class="multiple-select" name="multi1[]" size="6" multiple> <option value="2" selected>bald endede zuerst 2</option> <option value="3">bald endede 3</option> <option value="4">bald endede 6</option> <option value="5">bald endede zuerst 7</option> <option value="6">bald endede zuerst 8</option> </select> js первый способ: $(document).ready(function() { $('.multiple-select').triggerHandler('keydown'); $('.multiple-select').keydown(function(event){ var key; if (event) key=event.which; if(key==17 || key==16) {return false;} }); }); js второй способ: $(document).ready(function() { $('.multiple-select').bind('keydown', function(event){ var key; if (event) key=event.which; if(key==17 || key==16) {return false;} }); }); Если законсолить переменную кнопки вот так: if(key==17 || key==16) {console.log(key); return false;} то код выводится верный, т.е. все условия выполняются все ветки отрабатывают как надо. В основе своей они одинаковы отличаются только способом перехвата события, но к сожалению ни один из них не отменяет возможности выбора сразу нескольких пунктов с помощью кнопок. Подскажи пожалуйста верное решение.
-
Столкнулся с такой проблемой: необходимо выводить на страницу 5 изображений в линию и брать их в рамку, как показано здесь http://img398.imageshack.us/my.php?image=justifyoj7.jpg. Так чтобы слева и справа от изображений отступ был одинаковым и небольшим, а рамка равномерно заполнялась картинками за сч?т отступов между ними. Размер рамки фиксированный, размер картинок тоже. Зfдача осложняется тем, что в?рстка делается под шаблон, т.е. нельзя отдельно применять стили только к одной картинке или ссылке. Я наш?л 2 способа решить эту проблему 1)с помощью соседних селекторов 2)с помощью псевдокласса :first-child, но ИЕ6 как всегда сказал что ему на них положить большой ... (. У кого какие мысли по этому поводу? Заранее спасибо всем ответившим. html: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title></title> <link rel="stylesheet" href="justify_img.css" type="text/css"> <meta http-equiv="Content-Type" content="text/html; charset=win-1251"> <meta name="description" content=""> <meta name="keywords" content=""> </head> <body> <div id=main_container> <div id=in_work_box> <a href="#"><img title="1" alt="1" src="images/small1.jpg" width=129 height=45></a> <a href="#"><img title="2" alt="2" src="images/small2.jpg" width=129 height=45></a> <a href="#"><img title="3" alt="3" src="images/small3.jpg" width=129 height=45></a> <a href="#"><img title="4" alt="4" src="images/small4.jpg" width=129 height=45></a> <a href="#"><img title="5" alt="5" src="images/small5.jpg" width=129 height=45></a> </div> </div> </body> <html> css: html, body { height:100%; margin:0px; } img { border: none; } #main_container { width: 937px; margin: 220px auto; height: 100%; } #in_work_box { padding: 10px 15px; border: 1px solid #CFCFCF; text-align: left; } #in_work_box a { margin-left: 61px; } /*#in_work_box a+a { margin-left: 61px; }*/
-
Хм, действительно. Но я просмотрел все страницы форума, прежде, чем запостить тему, но ничего не наш?л. Извиняюсь, тему можно в треш...
-
Да, я тоже только что проверил. Често говоря, у меня сначала были сомнения в правильности использования инструкций для дочерних селекторов в разных браузерах, но вроде везде работает =). Vindex10, спасибо за помощь!
-
Собственно, верстал страницу, из 2х блоков Основного (container) и Футера (underline_container). Необходимо, чтобы при большом Основном блоке футер лежал под ним и появлялся на странице скролл, а в случае, когда Основной блок меньше высоты экрана, футер прижимался бы к низу экрана. Код, который я написал работает во всех браузерах, кроме ИЕ6, в н?м после футера появляется отступ равный по величине самому футеру. Как его победить? Заранее благодарен всем ответившим. Вот код: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title></title> <link rel="stylesheet" href="stylesheets/sss.css" type="text/css"> <meta http-equiv="Content-Type" content="text/html; charset=win-1251"> <meta name="description" content=""> <meta name="keywords" content=""> <style type="text/css"> html { height: 100%; } body { padding: 0px; margin: 0px; width: 100%; height: 100%; background-color: #FFFFFF; } #container { margin-bottom: -50px; padding: 0px; margin: 0px auto; width: 937px; min-height: 100%; background-color: #FF99CC; } *html #container { height: 100%; } #underline_container { position: relative; bottom: 50px; padding: 0px; margin: 0px auto; width: 937px; height: 50px; background: #FF9999 url('../images/underline.gif') repeat-x top; } #del { width: 937px; height: 80px; background-color: #FCCCFF; clear: both; } </style> </head> <body> <div id=container> Основной контейнер Здесь содержимое разной высоты <div id=del>Нужен для отделения футера от основного контейнера</div> </div> <div id=underline_container> Сам Футер</div> </body> </html>
-
ыы )) торопился сделать макет, чтобы выложить здесь. Не все копипасты исправил (, следует читать margin вместо margin-left...
-
Посмотрел все темы на форуме. Наш?л приблизительно похожие, но они мне не подходят. Сам мучался целый день, но проблему не решил... Задача: Есть страница, с шапкой head (красная) фиксированной ширины и высоты, меню left_menu (светло-голубое), главной страницей main_page (синяя), и нижним футером underline (зел?ный) высота и ширина фиксированны. Необходимо чтобы независимо от кол-ва текста на главной странице футер всегда был в нижней части экрана. Т.е. страница растягивалась вертикально. При большом кол-ве текста, естественно появляется прокрутка. Да это просто, скажите вы =). Задать футеру абсолютное позиционирование и прижать его вниз. Ан нет, задача усложняется тем, что вокруг всей страницы ид?т рамка шириной 20px и она должна включатся в общий размер страницы. Если прижать футер вниз, то он е? перекрывает, а если задать абсолютное позиционирование и контейнеру, то вс? ок, но страница не центруется горизонтально, а уходит в верхний левый угол ((. Вся страница выровнена горизонтально посередине экрана. Вот упрощ?нные коды html и css. Html: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title></title> <link rel="stylesheet" href="stylesheets/style_maket.css" type="text/css"> <meta http-equiv="Content-Type" content="text/html; charset=win-1251"> <meta name="description" content=""> <meta name="keywords" content=""> </head> <body> <div id=podlojka> <div id=container> <div id=head></div> <div id=left_menu>Здесь меню</div> <div id=main_page>Здесь должен быть текст</div> <div style="clear: left"></div> <div id=underline>Вот этот див нада опустить до низа страницы даже если текста мало</div> <div style="clear: left"></div> </div> </div> </body> </html> Css: body { margin: 0px; padding: 0px; height: 100%; background-color: #FFFFFF; } #podlojka { margin: 0px auto; height: 100%; width: 1000px; background-color: #003a6e; padding: 20px; } #container { width: 1000px; margin-left: 0px auto; background-color: #FFFFFF; } #head { width: 999px; height: 228px; background-color: #FF0000; } #left_menu { width: 322px; height: 200px; float: left; background-color: #e0eef7; } #main_page { padding: 20px; padding-top: 40px; width: 637px; background-color: #0000FF; float: left; } #underline { height: 60px; background-color: #00FF00; } Кто знает как такое реализовать напишите плз.