Можно ли в <select> сделать <option> многострочным? - Веб-программирование

30.09.2003, 19:57

Можно ли в <select> сделать <option> многострочным?
У меня итемы в выпадающем меню очень длинные (до 255 символов). Обычно в выпадающем меню: один итем - одна строка. А хотелось бы - если строка длиннее определённого, чтоб разбивалось хотя бы на две, с сохранением функциональности.

RaZEr · 30.09.2003, 20:04

Нет нельзя. Сделай пункты короткими или используй <input type="radio">

01.10.2003, 12:01

Неужели никакой ява скрипт или DHTML не позволяет это сделать?!...

Stasik · 01.10.2003, 17:50

нет.... хотя можно таблицу намутить с iframe... котоая выглядит также

RaZEr · 01.10.2003, 18:19

Ну да, фоновый цвет у ячеек менять, скрипт прописать который будет менять значение в input(type=hidden) в основном документе ... а надо оно все ? Куда проще просто input(type=radio) использовать.

01.10.2003, 18:56

ну на самом деле смена бэка прописывается через css двумя строчками.. трабл в показывании самого меню в нужном месте под большинством браузеров, но для этого можно юзать klayers

RaZEr · 01.10.2003, 18:59

Успехов ...

01.10.2003, 19:14

Если долго не извращаться то так... подогнать под вид селекта мона через css
меняя div.menu, div.select.
klayers - взять на сайте (ссылку где то здесь уже давал)
<style>
div.menu{position:absolute; top: 0px; left:0px; visibility:hidden;}
table.menu{border-collapse: collapse; width: 150px;}
table.menu tr, table.menu td{padding:0px; margin:0px;}
a.menu, div.select a{display:block;width:150px;color:black;text-decoration:none;}
div.select a{cursor:hand;}
a.select:hover{background-color: #316AC5; color:#fff;}
a.menu:hover, div.select a:hover{background-color: #316AC5; color:#fff;}
</style>
</head>
<script src="includes/js/klayers.js"></script>
<script>
last="";
function showMenu(src, target){
// hideMenu();
m1=layer(src);
m2=layer(target);

last = target;
m2.moveTo(m1.getAbsoluteLeft(), m1.getAbsoluteTop()+ 4 + m1.getHeight()); // move second menu relatively
m2.show();
event.cancelBubble = true;
}

function hideMenu(){
if (last != ""){
m2=layer(last)
m2.hide()
}
}
document.onclick = hideMenu;
</script>
<body>
<div class="select" id="select">
<a class="select" href="#" onclick="showMenu('select', 'menu'); return false;">Меню</a>
</div>
<div class="menu" id="menu">
<table class="menu">
<tr><td><a href="" class="menu">Первое меню</a></td></tr>
<tr><td><a href="" class="menu">Второе меню Второе меню</a></td></tr>
<tr><td><a href="" class="menu">Третье меню Третье меню Третье меню</a></td></tr>
<tr><td><a href="" class="menu">Четвертое меню</a></td></tr>
</table>
</div>
</body>
</html>

01.10.2003, 20:12

2medved2002
красивая вещь!!!

30.09.2003, 19:57	# 1
vlandus Guest Сообщения: n/a	Можно ли в <select> сделать <option> многострочным? Можно ли в <select> сделать <option> многострочным? У меня итемы в выпадающем меню очень длинные (до 255 символов). Обычно в выпадающем меню: один итем - одна строка. А хотелось бы - если строка длиннее определённого, чтоб разбивалось хотя бы на две, с сохранением функциональности.

01.10.2003, 17:50	# 4
Stasik Registered User Регистрация: 27.03.2002 Адрес: дома Сообщения: 1 660	нет.... хотя можно таблицу намутить с iframe... котоая выглядит также __________________ Всё будет хорошо!

30.09.2003, 20:04	# 2
RaZEr МОД-Оператор ЭВМ Регистрация: 18.04.2002 Адрес: Питер Сообщения: 4 343	Нет нельзя. Сделай пункты короткими или используй <input type="radio">

01.10.2003, 12:01	# 3
vlandus Guest Сообщения: n/a	Неужели никакой ява скрипт или DHTML не позволяет это сделать?!...

01.10.2003, 18:19	# 5
RaZEr МОД-Оператор ЭВМ Регистрация: 18.04.2002 Адрес: Питер Сообщения: 4 343	Ну да, фоновый цвет у ячеек менять, скрипт прописать который будет менять значение в input(type=hidden) в основном документе ... а надо оно все ? Куда проще просто input(type=radio) использовать.

01.10.2003, 18:56	# 6
medved2002 Guest Сообщения: n/a	ну на самом деле смена бэка прописывается через css двумя строчками.. трабл в показывании самого меню в нужном месте под большинством браузеров, но для этого можно юзать klayers

01.10.2003, 18:59	# 7
RaZEr МОД-Оператор ЭВМ Регистрация: 18.04.2002 Адрес: Питер Сообщения: 4 343	Успехов ...

01.10.2003, 19:14	# 8
medved2002 Guest Сообщения: n/a	Если долго не извращаться то так... подогнать под вид селекта мона через css меняя div.menu, div.select. klayers - взять на сайте (ссылку где то здесь уже давал) <style> div.menu{position:absolute; top: 0px; left:0px; visibility:hidden;} table.menu{border-collapse: collapse; width: 150px;} table.menu tr, table.menu td{padding:0px; margin:0px;} a.menu, div.select a{display:block;width:150px;color:black;text-decoration:none;} div.select a{cursor:hand;} a.select:hover{background-color: #316AC5; color:#fff;} a.menu:hover, div.select a:hover{background-color: #316AC5; color:#fff;} </style> </head> <script src="includes/js/klayers.js"></script> <script> last=""; function showMenu(src, target){ // hideMenu(); m1=layer(src); m2=layer(target); last = target; m2.moveTo(m1.getAbsoluteLeft(), m1.getAbsoluteTop()+ 4 + m1.getHeight()); // move second menu relatively m2.show(); event.cancelBubble = true; } function hideMenu(){ if (last != ""){ m2=layer(last) m2.hide() } } document.onclick = hideMenu; </script> <body> <div class="select" id="select"> <a class="select" href="#" onclick="showMenu('select', 'menu'); return false;">Меню</a> </div> <div class="menu" id="menu"> <table class="menu"> <tr><td><a href="" class="menu">Первое меню</a></td></tr> <tr><td><a href="" class="menu">Второе меню Второе меню</a></td></tr> <tr><td><a href="" class="menu">Третье меню Третье меню Третье меню</a></td></tr> <tr><td><a href="" class="menu">Четвертое меню</a></td></tr> </table> </div> </body> </html>

01.10.2003, 20:12	# 9
vlandus Guest Сообщения: n/a	2medved2002 красивая вещь!!!

Опции темы
Версия для печати Отправить на email