Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   Выпадающий список не помещается в div'е (https://javascript.ru/forum/dom-window/12734-vypadayushhijj-spisok-ne-pomeshhaetsya-v-div%27e.html)

LA_ 31.10.2010 15:34

Выпадающий список не помещается в div'е
 
Не знаю проблема ли с javascript или c css...
Использую стили и скрипты с сайта ВКонтакте.
В следующем коде почему-то:
1) выпадающий список не помещается в div'e в Internet Explorer'е (в FF - все хорошо);
2) кнопка-ссылка не становится не доступной после нажатия как в IE, так и в FF.
Как поправить?

<html>
    <script type="text/javascript">    
        var albums_list = [];
        
        function showPageAlbumExisting() {
            albums_list.unshift([1,'title1']);
            albums_list.unshift([2,'title2']);
            albums_list.unshift([3,'title3']);
            albums_list.unshift([4,'title4']);
            albums_list.unshift([5,'title5 title5 title5 title5 title5 title5 title5 title5 title5 title5 title5 ']);
            albums_list.unshift([6,'title6']);
            albums_list.unshift([7,'title7']);
            albums_list.unshift([8,'title8']);
            new Dropdown(ge('album'), albums_list, {
                width: 250,
                selectedItems: '4',
                multiselect: false
              });
        }
    </script>
    <head>
        <link rel="stylesheet" href="http://vkontakte.ru/css/rustyle.css?83" type="text/css" />
        <link rel="stylesheet" href="http://vkontakte.ru/css/photos2.css?39" type="text/css" />
        <link rel="stylesheet" href="http://vkontakte.ru/css/nopadding.css" type="text/css" />
        <link rel="stylesheet" href="http://vkontakte.ru/css/ui_controls.css?20" type="text/css" />
        <script src="http://vkontakte.ru/js/common.js?195"></script>
        <script type="text/javascript" src="http://vkontakte.ru/js/lib/ui_controls.js?77"></script>        
    </head>
    <body onload="javascript:showPageAlbumExisting()">
        <center>
            <div id="pageContainer">
                <div id="pageLayout">

                    <div id="pageHeader">
                        <div id="pageHeaderRight">

                            <h1 id="home"><a href="javascript:void(0)">ВКонтакте</a></h1>

                            <div id="topNav" class="headNav">
                                <a href="javascript:void(0)">текст</a>
                            </div>

                        </div>
                    </div>
                    <div id="sideBar">
                        <ol id="nav">
                            <li><a href="javascript:showPageAlbumExisting();">Раздел</a></li>
                        </ol>
                    </div>
                    <div id="pageBody" class="pageBody">
                        <div id="wrap2">
                            <div id="wrap1">
                                <div id="content">
                                    <div class="editorPanel clearFix">
                                        <div class="editAlbum" id="album_name_existing">
                                            <form>
                                                <h5 style="color: rgb(54, 99, 142); font-size: 12px; font-weight: bold; margin: 10px 0px;">Список</h5>
                                                <div class="labeled"><input type="hidden" id="album" name="album"/></div>

                                                <ul class="nNav">
                                                    <li>
                                                        <b class="nc"><b class="nc1"><b></b></b><b class="nc2"><b></b></b></b>
                                                        <span class="ncc"><a href="javascript:this.disabled=true; void(0);" tabindex="3">Кнопка</a></span>
                                                        <b class="nc"><b class="nc2"><b></b></b><b class="nc1"><b></b></b></b>
                                                    </li>
                                                </ul>
                                            </form>
                                        </div>                                        
                                    </div>    
                                </div>
                            </div>
                        </div>
                    </div>
                    <div id="boxHolder"></div>
                    <div id="bFooter">
                        <p>some text<br /><small><a href="http://vkontakte.ru/">vkontakte.ru</a></small></p>
                    </div>

                </div>
                <br />
            </div>
        </center>        
    </body>
</html>

LA_ 31.10.2010 16:09

Со списком разобрался - надо было добавить
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

в начало документа.
Остался вопрос с кнопкой.

ksa 01.11.2010 10:26

Цитата:

Сообщение от LA_
Остался вопрос с кнопкой.

С этой?

<span class="ncc"><a href="javascript:this.disabled=true; void(0);" tabindex="3">Кнопка</a></span>


Таки это не кнопка... Это ссылка.

LA_ 01.11.2010 10:29

да, с этой ссылкой (визуально ссылка оформлена в виде кнопки, потому так её назвал)

Kolyaj 01.11.2010 10:32

От того, что вы оформили ссылку как кнопку, она кнопкой не стала. У ссылок нет понятия недоступности, она не умеет быть disabled.

ksa 01.11.2010 10:43

LA_, как вариант, меняй ей стиль на какой-то другой, дабы сделать её похожей на неактивную кнопку...
Или таки переделай в кнопку.

<button>
<содержимое>
</button>


Часовой пояс GMT +3, время: 20:32.