Про оперу и развлечения с css’ом

Так получилось что издревне пользуюсь браузером Опера, а прямо в ней можно открывать фтп (ого!!!!) что удобно если надо скачать фильм с сервера. Но по непонятной причиние уже много лет стандартный стиль для просмотра фтп похож на тыкву и как им пользоваться мне искренне непонятно: ширина для контента 650px, из них под название отводится аж 160px! Название фильма может переноситься на несколько строк, а сделать ширину, к примеру, 80% ИМ ТАМ, видимо, не позволяют голоса в голове. Стандартный шаблон выглядит вот так (без длинных названий — зачем показывать некрасивое):

А опера ведь кастомизируемый браузер с возможностью настроить интерфейс как хочется! И, конечно же, шаблон для просмотра фтп тоже можно отредактировать! Гм… А редактировать-то можно только css, то есть никак нельзя изменить сам шаблон и никак нельзя использовать js, только css, только хардкор. Видимо это сделано из соображений безопасности и лени. Но мне и доступа к css’у за глаза. Мой стандартный шаблон для просмотра фтп теперь выглядит так:

Убрал бесполезную надпись “File listing”, ширина для контента 90%, убрал ненужный _мне_ столбец с датой. Так же сделал подсветку строки под курсором и увеличил ширину ссылки даже за пределы ссылки. Если поводить мышкой на примере то даже мой сбивчивый слог можно будет понять.

Но потом я решил немного поиграться и сделал представление в виде списка. Ширина исскуственно ограничена до 1215px чтобы показывалось корректно на разных экранах. Тут можно было бы сделать ширину в те же 90%, но, во-первых, пользоваться этим _мне_ неудобно и сделал я это забавы ради, а во-вторых это всего-лишь промежуточный шаг перед следущим примером. Оно получилось случайно (была бы работа — в жизни бы не признался :)) и я его сделал подобным списку в виндоусе добавив иконку дирректории (в очередной раз спасибо Болку за его неудержимую страсть к исследованиям) и убрав ненужные данные. Вообще заиспользовав позиционирование можно было бы в футере показывать размер, тип и формат файла как в статус баре — может сделаю потом. Итак:

Но это всё несложное, мне же захотелось использовать P0W3R 0F CSS3, захотелось сделать фтп в виде меню из какой-то компьютерной игры, из какой не вспомню, ну и начал творить. В процессе оказалось опера совсем не дружит с css-анимацией и тормзоит безбожно. Впрочем как и файрфокс, а вот webkit удивляет скоростью. Вообще учитывая глючность последних версий оперы я всё больше засматриваюсь на хром. Последний пример я рекомендую смотреть именно в хроме из-за скорости работы:

Делать только при помощи css было по-настоящему интересно. В хроме, правда, есть какая-то проблема с прозрачностью в конце анимации. А в виду скорости работы в опере это решение совсем непригодно к использованию. Поэтому ширина опять же строго фиксирована на 1215px, а максимальное колличество строк равно пяти, хотя всё это можно поменять при желании.

Причем всё это не бесполезные эксперементы, а вполне готовая к использованию вещь, достаточно взять нужны dir.css и положить его вместо вашего, например у меня надо заменить файл “/usr/share/opera/styles/dir.css”, но у вас он может быть в другом месте.

Традиционно бесполезная ссылка на github, но пускай будет!

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

2011.11.25 13:40