Прокрутите все заголовки изображений и измените выравнивание текста по левому или по центру? - PullRequest
Новая
       25

Прокрутите все заголовки изображений и измените выравнивание текста по левому или по центру?

0 голосов
/ 01 июня 2019

Я создал галерею изображений, используя код из модального лайтбокса W3Schools.Я внес в него некоторые изменения, чтобы он соответствовал моим потребностям, например.У меня есть изображения, перечисленные в отдельных файлах php (photography.php, 3dmodels.php и т. Д.), А затем включены в php файл галереи.Также текст заголовка взят не из alt, а из div.Галерея изображений работает нормально (в любом случае, в Chrome).

Когда изображение открыто в большом представлении, заголовок центрируется, и это выглядит некрасиво, если в тексте более одной строки.Выровнять текст по левому краю тоже нехорошо, потому что некоторые вертикальные изображения узкие.Итак, как сделать так, чтобы заголовки были выровнены по левому краю, если имеется более одной строки текста, и по центру, если есть только одна строка?

В галерее 5 категорий (#gall_valittu) и всегоиз 103 изображений с подписями (#caption_text).Я пробовал с одним "для цикла", а теперь с двумя циклами.Плагин actual-jquery (.actual (outerHeight)) предназначен для получения высоты всего текста.У меня тоже были проблемы с этим, но эта опция, кажется, помогает.

$(document).ready(function() {
    var caption_div = $("div#gall_valittu"); // Gives 5 divs
    for (var z = 0; z < caption_div.length; z++) {
        var tekstit = $("p#caption_text"); // Gives 103 images
        for (var y = 0; y < tekstit.length; y++) {
            var caption_area = $("#caption");
            //var caption_txt = $("p#caption_text");
            var area = caption_area.outerHeight();
            var txt = $("p#caption_text").actual("outerHeight"); //jquery.actual.min.js !!!
                if (txt < area) {document.getElementById("caption_text").style.textAlign = "center";}
                else {document.getElementById("caption_text").style.textAlign = "left";}
        }   
    }
});

Моя проблема в том, что я не могу заставить работать цикл for.Останавливается после первого изображения.Это выравнивает текст правильно, хотя.Я пытался без оператора if, чтобы увидеть, работает ли цикл for, и это не так.Я действительно не знаю javascript, мой навык в основном стиль копирования / вставки.

Вот ссылка на тестовую страницу http://kaasimir.name/diipadaapa/testi/gallery.php?

...