Форум программистов [Powered by Invision Power Board]

Версия для печати темы
Нажмите сюда для просмотра этой темы в оригинальном формате

Форум программистов > Вёрстка веб-сайтов > Списки со своими метками

Автор: MasterSID 28.2.2006, 11:37

Мне вот захотелось сдлеать список с обратным порядком цифр.
Как такое можно реализовать чтобы работало во все браузерах? Желательно через сами списки, т.к. мне они нравятся своими отступами, либо как эти отсупы можно самому реализовать?

Автор: smartov 28.2.2006, 12:48

MasterSID,
Это можно было бы сделать с помощью такой вещи как counter в CSS. Но IE это не поддерживает.

Есть своего рода "хак"
http://paularmstrongdesigns.com/weblog/reverse-ordered-lists
http://paularmstrongdesigns.com/examples/css/reverse-list.html
Но это не с помощью самой технологии ol-листов.

Посему JS тебе в помощь. Типа такого

Код


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN">
<HTML>
<BODY>

<style>
/*убрать буллеты*/
li {list-style-type: none;}
</style>

<ul id="reverse">
    <li> This is the first item.
    <li> This is the second item.
    <ul>
        <li>Sub list
        <li> Items
    </ul>
    <li> This is the third item.
</ul>


<script>
function setReverseNumbering($list_to_change)
{
    var list = $list_to_change;
    var items = list.childNodes;
    
    for (var i=0;i<items.length;i++)
        if (items[i].nodeName == 'LI')
            items[i].innerHTML = (items.length-i)+'. '+items[i].innerHTML;
        
    sub_uls = list.getElementsByTagName('UL');
    if (sub_uls.length > 0)
        for (var ui=0;ui<sub_uls.length;ui++)
            setReverseNumbering(sub_uls[ui]);
}

/*написать номера для списка с id="reverse"*/
setReverseNumbering(document.getElementById('reverse'));
/*номера написаны*/
</script>

</BODY>
</HTML>

Лицензия GNU. Можешь юзать smile

Только что написал smile

Самому интересно стало как эту фигню реализовать.

Автор: AzuManga 28.2.2006, 12:53

К сожалению, ИЕ не понимает counter-increment, и вообще со списками без применения javascript полноценно умеет работать только опера 7 и старше 8((

http://imfo.ru/archive/2003/10/11/counters_version_1_1 - тут народные умельцы вроде сумели решить проблему, но только с помощью javascript

хихи пока писал пост - уже ответили 8))

Автор: MasterSID 2.3.2006, 09:12

эм, пардон, но с js не годится smile

Я пока решил проблему проставляя вручную в каждый LI в параметр value

Автор: smartov 2.3.2006, 12:08

Отличное решение проблемы.
Чем не годится js?

Автор: AzuManga 2.3.2006, 15:23

наверное своей непопулярностью у пользователей 8)) фаерволы как винды так и сторонних производителей блокируют js по умолчанию и большинство пользователей даже не забивает себе голову тем, что с этим надо что-то делать 8(( Да и многие пользователи, знающие как разрешить скрипты, зачастую их блокируют 8)))

Автор: Illuminaty 2.3.2006, 15:29

AzuManga, извини конечно, но ты немного ошибаешься...
Дела совсем не так плохи smile

Автор: Ciber SLasH 2.3.2006, 16:51

Сейчас уже все давно знают, что без JS ты практически никакую страницу нормально не увидешь.
И во всех браузерах по умолчанию включен JS.

Автор: smartov 3.3.2006, 17:26

Ciber SLasH,

Цитата(Ciber SLasH @ 2.3.2006, 15:51

)

Сейчас уже все давно знают, что без JS ты практически никакую страницу нормально не увидешь.И во всех браузерах по умолчанию включен JS.

Подписываюсь под каждым словом