Кнопка закрытия цветного поля и заголовок не отображаются

#jquery #colorbox

Вопрос:

Я вижу, что содержимое заголовка успешно считывается из веб-браузера, и настройки кнопки закрытия в css также верны, поскольку я вижу файл control.png, загруженный с помощью элемента Inspect. Мне нужно, чтобы заголовок и кнопка закрытия оставались на 20 пикселей в верхней части плавающего окна. Попытка изменить индекс cboxOverlay, cboxTitle и cboxColose не работает.

НО я не вижу заголовок или кнопку закрытия. Вот часть моего кода:

 <head>
    <script>
        $(document).ready(function() {
            //assign the Colorbox event to elements
            $(".feap2d").colorbox({
                inline: true,
                width: "700px"
            });
        });
    </script>
</head>
<body>
    <table class="ap">
        <tr>
            <td width="50%" valign="top" id="iP2D">
                <div class="productn">
                    <div class="vcompare">//Assign title to show as the title in Colorbox <a class="feap2d" href="#feap2d" title="test title">Version compare</a>

                    </div>
                </div>
            </td>
        </tr>
    </table>
    <div style='display:none'>//inline contents for element feap2d
        <div id='feap2d'>[
            <uc1:fP ID="fP" runat="server" />]</div>
    </div>
</body>

У меня недостаточно репутации, поэтому я не могу опубликовать изображение в illustrator проблема.

JSFiddle

Ответ №1:

Это ваша проблема с Css

просто измените cboxTitle css top peroperty на 0

 top:0px;

та же проблема и с вашей кнопкой закрытия

1. изменение top на 0px может отображать заголовок, но это не устраняет проблему. вот пример страницы, и вы можете видеть, что заголовок находится над всплывающим окном. file:///C:/Users/Dodo.W/Desktop/colorbox-master/example2/index.html Вот обновленный jsfiddle. чистый результат. jsfiddle.net/v8djT/11/embedded/result Кроме того, кнопка colose по-прежнему не отображается.

2. путь к изображению на фоне кнопки закрытия неверен … и создайте свою скрипку, как this…jsfiddle.net/kka284556/f32rk/1

3. Вот оригинальный пример: jacklmoore.com/colorbox/example2 Мне нужно, чтобы заголовок и кнопка закрытия отображались за пределами плавающего окна, то есть — 20 пикселей в верхней части окна. Я не знаю, почему изображение для кнопки закрытия неверно в jsfiddle. чистый пример, но здесь, на моей локальной странице, он исправлен, загружен в браузер.

4. попробуйте еще одну вещь… просто укажите высоту также … при вызове функции colorbox

5. Добавить высоту тоже не работает, это добавляет больше места внизу, но не показывает заголовок и кнопку закрытия. Я попытался изменить индекс cboxOverlay, cboxTitle и cboxClose, но ничего не изменилось. jsfiddle.net/v8djT/23/embedded/result