IMHO.WS

IMHO.WS (http://www.imho.ws/index.php)
-   Веб-программирование (http://www.imho.ws/forumdisplay.php?f=29)
-   -   Можно ли в <select> сделать <option> многострочным? (http://www.imho.ws/showthread.php?t=39911)

vlandus 30.09.2003 19:57

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

RaZEr 30.09.2003 20:04

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

vlandus 01.10.2003 12:01

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

Stasik 01.10.2003 17:50

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

RaZEr 01.10.2003 18:19

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

medved2002 01.10.2003 18:56

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

RaZEr 01.10.2003 18:59

Успехов ...

medved2002 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>

vlandus 01.10.2003 20:12

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


Часовой пояс GMT +4, время: 23:10.

Powered by vBulletin® Version 3.8.5
Copyright ©2000 - 2025, Jelsoft Enterprises Ltd.