Форум: Форум PHPФорум ApacheФорум Регулярные ВыраженияФорум MySQLHTML+CSS+JavaScriptФорум FlashРазное
Новые темы: 0000000
PHP 5. На примерах. Авторы: Кузнецов М.В., Симдянов И.В., Голышев С.В. Самоучитель MySQL 5. Авторы: Кузнецов М.В., Симдянов И.В. MySQL 5. В подлиннике. Авторы: Кузнецов М.В., Симдянов И.В. PHP Puzzles. Авторы: Кузнецов М.В., Симдянов И.В. C++. Мастер-класс в задачах и примерах. Авторы: Кузнецов М.В., Симдянов И.В.
ВСЕ НАШИ КНИГИ
Консультационный центр SoftTime

HTML+CSS+JavaScript

Выбрать другой форум

 

Здравствуйте, Посетитель!

вид форума:
Линейный форум (новые сообщения вниз) Структурный форум

тема: Пропадают слои

Сообщения:  [1-5] 

 
 автор: MiXOH   (20.09.2007 в 13:17)   письмо автору
 
   для: sim5   (20.09.2007 в 12:39)
 

После танцев с бубном, была найдена суть ошибки.
Оказывается со слоями все нормально, проблема с таблицами.
При раскрытии пропадают не слои а таблицы с данными. Таблицы нужны для того, чтобы данные оставались на странице, т.к. при сдвиге слоя, часть его выходит за границы страницы и становиться не видна пользователю.

Вот код для примера:

    <script>
        function show(toShow) {
            var t_show = document.getElementById(toShow);
            if(t_show.style.display=="none") t_show.style.display = "";
            else t_show.style.display="none";
         }
    </script>
    
    <a href="JavaScript:show('div1')"><b>div1</b></a> <br>
        <div id="div1" style="display:none;position:relative;left:5%;z-index:1">
        <table width="95%" border="1">
        <tr><td>
            div1<br>
            <a href="JavaScript:show('div2')"><b>div2</b></a> <br>
            <div id="div2" style="display: none;position:relative;left:5%;z-index:1">
            <table width="95%" border="1">
            <tr><td>
                div2<br>
                <a href="JavaScript:show('div3')"><b>div3</b></a> <br> 
                <div id="div3" style="display: none;position:relative;left:5%;z-index:1">
                <table width="95%" border="1">
                <tr><td>
                    div3<br>
                </td></tr>
                </table>
                </div>
                <a href="JavaScript:show('div4')"><b>div4</b></a> 
                <div id="div4" style="display: none;position:relative;left:5%;z-index:1">
                <table width="95%" border="1">
                <tr><td>
                    div4<br>
                </td></tr>
                </table>
                </div>
            </td></tr>
            </table>
            </div>
            <a href="JavaScript:show('div5')"><b>div5</b></a>
            <div id="div5" style="display: none;position:relative;left:5%;z-index:1">    
            <table width="95%" border="1">
            <tr><td>
                div5<br>
                <a href="JavaScript:show('div6')"><b>div6</b></a> <br>
                <div id="div6" style="display: none;position:relative;left:5%;z-index:1">
                <table width="95%" border="1">
                <tr><td>
                    div6<br>
                </td></tr>
                </table>
                </div>
                <a href="JavaScript:show('div7')"><b>div7</b></a> 
                <div id="div7" style="display: none;position:relative;left:5%;z-index:1">
                <table width="95%" border="1">
                <tr><td>
                    div7<br>
                </td></tr>
                </table>
                </div>
            </td></tr>
            </table>
            </div>
        <br><br>
        </td></tr>
        </table>
        </div>
    <a href="JavaScript:show('div8')"><b>div8</b></a> <br>
        <div id="div8" style="display:none;position:relative;left:5%;z-index:1">
        <table width="95%" border="1">
        <tr><td>
            <a href="JavaScript:show('div9')"><b>div9</b></a>
            <div id="div9" style="display: none;position:relative;left:5%;z-index:1">    
            <table width="95%" border="1">
            <tr><td>
                div9<br>
                <a href="JavaScript:show('div10')"><b>div10</b></a> <br>
                <div id="div10" style="display: none;position:relative;left:5%;z-index:1">
                <table width="95%" border="1">
                <tr><td>
                    div10<br>
                </td></tr>
                </table>
                </div>
                <a href="JavaScript:show('div11')"><b>div11</b></a> 
                <div id="div11" style="display: none;position:relative;left:5%;z-index:1">
                <table width="95%" border="1">
                <tr><td>
                    div11<br>
                </td></tr>
                </table>
                </div>
            </td></tr>
            </table>
            </div><br>
            <a href="JavaScript:show('div12')"><b>div12</b></a>
            <div id="div12" style="display: none;position:relative;left:5%;z-index:1">    
            <table width="95%" border="1">
            <tr><td>
                div12<br>
            </td></tr>
            </table>
            </div>        
        <br>
        </td></tr>
        </table>
        </div>
    <br>

   
 
 автор: sim5   (20.09.2007 в 12:39)   письмо автору
 
   для: MiXOH   (20.09.2007 в 12:34)
 

Сдвигать еще по top, может быть. А вообще, вы предложили погадать на картах, не показав свой код.

   
 
 автор: MiXOH   (20.09.2007 в 12:34)   письмо автору
 
   для: AlexSol   (19.09.2007 в 20:13)
 

Я не совсем понял, что лишнее, position:relative или z-index:1.
Поэтому объясню необходимость каждого.
position:relative - необходимо для того чтобы свойство left:5% смещала следующий слой вправо относительно начала предыдущего, остальные значения position не дают такого эффекта. Поэтому это не лишнее, без него не будет должного эффекта сдвига.
z-index:1 - раньше этого не было, и проблема была таже, так что даже если убрать ничего не исмениться.

   
 
 автор: AlexSol   (19.09.2007 в 20:13)   письмо автору
 
   для: MiXOH   (19.09.2007 в 18:55)
 

position:relative;z-index:1- лишнее

>при попытке раскрыть все ответы

думаю ваша проблема именно в этой части ))

   
 
 автор: MiXOH   (19.09.2007 в 18:55)   письмо автору
 
 

Привет всем!

Задача: мне нужно сделать сдвиг слоев, т.е. пользователю задается вопрос, и предлагаются варианты ответов. При выборе ответа, появляется следующий вопрос с вариантами ответа. Все вопросы находятся в div-ах, и естественно не видны пока пользователь не выберет ответ. Также они сдвинуты в виде лестницы, т.е. следующий появляется правее предыдущего. Организовал это так <div id="div1" style="display: none;position:relative;left:5%;z-index:1">.

Проблема: при попытке раскрыть все ответы, некоторые из предыдущих пропадают (становяться не видны).

Подскажите, пожалуйста, решение проблемы или другой способ решения задачи.

   

Сообщения:  [1-5] 

Форум разработан IT-студией SoftTime
Rambler's Top100
вверх

Rambler's Top100 Яндекс.Метрика Яндекс цитирования