Как обращаться с nth-child для Internet Explorer 8

Question

Как обращаться с nth-child для Internet Explorer 8

У меня есть php-скрипт, который вызывает серию изображений, которые отображаются так:

Это код PHP, который их вызывает:

<?php

$query = "SELECT
parent_business_id,
image_url,
alt_tag,
description,
thumb_url,
business
FROM
images
ORDER BY
RAND()
LIMIT
6
";

$result = mysql_query($query, $dbc)
or die (mysql_error($dbc));

while($row = mysql_fetch_array($result)) {

$parent = $row["parent_business_id"];
$image = $row["image_url"];
$alt = $row["alt_tag"];
$description = $row["description"];
$thumb = $row["thumb_url"];
$business = $row["business"];

$mainthumb = "./images/270x270/$image.jpg";

echo

"<div class='gallery_image_container'>



</div>";

}

?>

At the moment I am using css3's nth-child to add margins to the central images:

div.gallery_image_container:nth-child(3n+2){
margin-left:10px;
margin-right:10px;
}

The problem I have is this works great in browsers that support css3 but ie 7 and ie 8 will not and I need a solution. I am thinking that maybe I can do this by adding classes in php. If so which function would I use. Is there an nth-child like selector in php?

0

добавлено 07 Февраль 2013 в 11:11 автор Richard Bell отредактировано 08 Февраль 2017 в 02:39

Просмотры: 3

источник

nl ja de

PHP действительно не имеет селектора nth-child, но вы можете сделать это самостоятельно, когда вы зацикливаете, чтобы распечатать их, если это второй элемент, 5-й элемент и т. Д., Просто добавьте класс.

добавлено 07 Февраль 2013 в 11:14, автор Andy, источник

но стоит упомянуть: ORDER BY RAND() - чрезвычайно медленный способ выполнения запроса. Он в основном должен загружать всю таблицу. Это прекрасно для небольших таблиц, но если у вас много данных, ORDER BY RAND() даст вам очень плохие проблемы с производительностью.

добавлено 07 Февраль 2013 в 11:44, автор SDC, источник

также не относится к теме, но определенно стоит упомянуть: функции mysql_xxx() на PHP устарели. Это означает, что PHP отказывается от поддержки для них и может полностью удалить их из языка в будущих версиях. В любом случае, независимо от того, они считались устаревшими и небезопасными в течение длительного времени. Рекомендуется strong переключиться на использование одного из лучших API-интерфейсов mysql, предоставляемых PHP, либо mysqli , либо PDO .

добавлено 07 Февраль 2013 в 11:46, автор SDC, источник

@RichardBell - re ORDER BY RAND() : если это небольшая таблица, и если вы уверены, что она останется маленькой, то придерживайтесь того, что у вас есть. Если это будет больше, или если у вас есть другие таблицы, которые вы хотите заказать случайным образом, это будет большой, есть другие методы, которые работают лучше. Есть несколько вариантов, и я знаю, что на этом сайте есть ответы, которые подробно описывают их, поэтому немного поработайте, если вам нужно.

добавлено 07 Февраль 2013 в 12:05, автор SDC, источник

@RichardBell - устаревшие функции. В руководстве по PHP содержится подробная информация. Из других опций mysqli довольно похож на MySQL ; как правило, не слишком много хлопот для переключения. PDO более мощный, но синтаксис совершенно другой, поэтому может потребоваться немного больше усилий, но он стоит того, в конечном счете.

добавлено 07 Февраль 2013 в 12:08, автор SDC, источник

@SDC Стол относительно небольшой, поэтому я не слишком беспокоюсь о проблемах с производительностью. Однако, если есть лучший способ, я открыт для предложений. Спасибо за ваш комментарий.

добавлено 07 Февраль 2013 в 11:58, автор Richard Bell, источник

@SDC Реферируемые функции - проблема. Мне нужно будет изучить это. Я почти новичок, когда речь заходит о MySQL и php. Будет ли это болезненный переход?

добавлено 07 Февраль 2013 в 12:01, автор Richard Bell, источник

3 ответы

Видеокурс "Создание приложений для Android"

Получи множество видеоуроков по Android сейчас

Как упоминал Энди в комментариях, вы можете узнать, с какими элементами вы должны добавить класс с PHP. Все, что вам нужно - это модульное подразделение.

Чистое CSS-решение требует улучшения вашего HTML. Это, очевидно, список изображений, поэтому: Используйте список. Полученный HTML-код должен выглядеть примерно так:

Теперь в CSS удалите правило nth-child и вместо этого добавьте следующие два правила:

.gallery_container {
    margin: 0 0 0 -20px;
    padding: 0;
    list-style: none;
}
.gallery_container > li {
    margin: 0 0 0 20px;
    padding: 0;
    float: left;
}

1

добавлено 07 Февраль 2013 в 11:34 автор dave

источник

Отличное решение. Большое спасибо. Вы были правы с 10px, прежде чем отредактировать свой ответ.

добавлено 07 Февраль 2013 в 12:39, автор Richard Bell, источник

Видеокурс по Java для начинающих

Получи видеокурс по Java для начинающих с упражнениями

Система управления ссылками ReDirector 3.0

Автор: Евгений Попов

автор spathirana · Answer 1 · 2013-02-07T11:22Z

Можешь попробовать

$(identifier:nth-child(3n+2)').addClass('styleClassName');

использование jQuery

1

добавлено 07 Февраль 2013 в 11:22 автор spathirana

источник

Я не думаю, что размещение Javascript-решения здесь поможет. Особенно, если это зависит от структуры. Это можно (и должно) делать с помощью CSS или, если нет другого способа, с PHP.

добавлено 07 Февраль 2013 в 11:35, автор dave, источник

автор SDC · Answer 2 · 2013-02-07T11:42Z

Если вы хотите использовать селекторы CSS, такие как nth-child , которые не поддерживаются в IE8, я хотел бы использовать Selectivizr .

Selectivizr - это библиотека Javascript, которая возвращает целый ряд селекторов CSS в старые версии IE, так что ваш стандартный CSS-код может работать без изменений во всех браузерах.

Другой альтернативой является старый сценарий под названием ie7.js (и его позднее версии ie8.js и ie9.js), что также делает то же самое, плюс исправление нагрузки других ошибок и причуд в IE. Но мое предпочтение было бы в отношении Selectivizr, поскольку оно намного больше нацелено (то есть оно не делает столько, сколько ie7.js), и его гораздо более новый код, оба из которых должны означать, что он работает лучше.