PDA

Просмотр полной версии : Миниатюры (tumbnail) в сообщениях, настраиваемые по вашему размеру


ErikPshat
29.10.2012, 06:31
Миниатюры можно вставлять в сообщениях через код
Вот такой примитивный пример:


PSP-E1000 TA-096

FB - Предохранитель подсветки экрана 2 шт - 1 с тыльной стороны + 1 с лицевой.
LB - Предохранитель питания USB 3 шт - 2 с тыльной стороны и 1 с лицевой.
TB - Предохранитель питания консоли 1 шт с лицевой стороны.

Щёлкните "Увеличить" на изображении, чтобы открыть его в новом окне.
Для просмотра в 100% масштабе, щёлкайте значёк мышки [+] в нужной части изображения.

Лицевая сторона: предохранители FB / LB / TB

[DECOR="url(attachment.php?attachmentid=7915); background-size: cover; width: 200px; height: 150px"]Увеличить (http://www.pspx.ru/forum/attachment.php?attachmentid=7915)

Обратная сторона: предохранители подсветки экрана FB и USB LB

Увеличить (http://www.pspx.ru/forum/attachment.php?attachmentid=7916)


Вот такой код вставляем по нажатию кода декора http://www.pspx.ru/forum/cleardoc/editor/marker.gif:
url(attachment.php?attachmentid=7915); background-size: cover; width: 200px; height: 150px

url(attachment.php?attachmentid=7915) вы можете вставить потом, это ссылка на картинку бэкграунда, который будет отображаться в сообщении, как Тумбнейл (миниатюра).
background-size: cover - масштабирует изображение с сохранением пропорций таким образом, чтобы картинка целиком поместилась внутрь блока.
width: 200px; height: 150px - собственно размеры блока Декора.


Далее, внутри, между тегами Декора, помещаем слово "Увеличить" и обрамляем его ссылкой на полномасштабное изображение, собсно ту же самую картинку, что ставили в бэкграунд, только с полным путём.
Ну тут можно приукрасить увеличение, на сколько хватает фантазии, можно вместо слова увеличить повесить картинку с +сиком, либо поместить надпись в любое место блока, на надпись повесить свой фон, цвет и т.д., благо код Декора позволяет производить всё, что угодно.

ErikPshat
29.10.2012, 09:20
Вот такой код с иконкой лупы с плюсиком:

http://www.pspx.ru/forum/images/icons/zoom.png (http://s.pikabu.ru/images/big_size_comm/2012-06_6/13407242629490.jpg)




http://www.pspx.ru/forum/images/icons/zoom.png
(http://s.pikabu.ru/images/big_size_comm/2012-06_6/13407242629490.jpg)



Иконка лежит на форуме здесь: http://www.pspx.ru/forum/images/icons/zoom.png
Код декора - тот же.
Просто ставите картинку лупы, обрамляете её ссылкой на полномасштабную картинку, затем выравниваете по правому краю с помощью FLOAT.


Вообще можно сделать отдельным BB-кодом.

vash
29.10.2012, 12:20
Так и я про то писал, чтоб на форуме так можно делать через BB-коды всем форумчанам (а не ссылкой под спойлером, который увеличивает время загрузки страницы). А Декором только модераторы и админы могут пользоваться.

ErikPshat
29.10.2012, 16:54
А Декором только модераторы и админы могут пользоваться.Да нет, декором все могут пользоваться. У кого мозги есть, тот подсмотрит код в других сообщениях через цитату.

Другие пользователи просто не видят кнопок Декора и таблиц в форме ответа, а использовать код все могут.

vash
29.10.2012, 17:05
У кого мозги есть, тот подсмотрит код в других сообщениях через цитату.
Таких, моё ИМХО, единицы (я не про мозги). Не в обиду будет сказано, до такого не каждый модератор-то дотумкает (вот я точно не знал).

ErikPshat
29.10.2012, 17:26
Djordj10, при простом форматировании карты памяти в ПСП с кастомной прошивкой появляются такие папки:




http://www.pspx.ru/forum/images/icons/zoom.png
(http://img12.**************/img12/2475/29121230.png)



Всего остального не должно быть, скинь скриншот того, что у тебя получается.

vash, ты в декоре, между тегами, убирай перенос на новую строку. Потому что переносы учитываются и картинка лупы сдвигается на новую строку.
Я так код написал для визуального просмотра, чтобы видно было, где открывается тег, а где закрывается, т.е. чтобы было более понятно, а не всё в кучу.

На самом деле перенос строки (ENTER) не нужен, это в HTML переносы не учитываются, а в BB-кодах учитываются. Пробелы не учитываются.
Твой код должен был выглядеть так:
http://www.pspx.ru/forum/images/icons/zoom.png (http://img12.**************/img12/2475/29121230.png)

COOLERbyPSP
29.10.2012, 20:44
Лупа как-то не вписывается =\
Иконочку бы попроще

ErikPshat
29.10.2012, 20:53
А чё с лупой? По-моему вполне нормально, по сравнению с самой миниатюрой вполне гигиенично смотрится.
Ну это первое, что попалось мне на глаза в Яндекс.Картинках.

COOLERbyPSP, ты смотрел тег в последнем посту?

Иконочку бы попрощеВ смысле? Поменьше, без прозрачности, чтобы никто не догадался, что именно там нужно нажать для увеличения?

Эмм, напись отображается при наведении на лупу: "Нажмите для увеличения"?

KirJan-DeSign
29.10.2012, 21:24
попалось мне на глаза в Яндекс.Картинках.
ая-яй)))) а что-то из этих не подойдёт?

792379247925792679277928

ErikPshat
29.10.2012, 21:32
Ну давай потестим, какая лучше подходит...

http://www.pspx.ru/forum/images/icons/zoom.png (http://s.pikabu.ru/images/big_size_comm/2012-06_6/13407242629490.jpg)

http://www.pspx.ru/forum/attachment.php?attachmentid=7923 (http://s.pikabu.ru/images/big_size_comm/2012-06_6/13407242629490.jpg) http://www.pspx.ru/forum/attachment.php?attachmentid=7924 (http://s.pikabu.ru/images/big_size_comm/2012-06_6/13407242629490.jpg) http://www.pspx.ru/forum/attachment.php?attachmentid=7925 (http://s.pikabu.ru/images/big_size_comm/2012-06_6/13407242629490.jpg)

http://www.pspx.ru/forum/attachment.php?attachmentid=7926 (http://s.pikabu.ru/images/big_size_comm/2012-06_6/13407242629490.jpg) http://www.pspx.ru/forum/attachment.php?attachmentid=7927 (http://s.pikabu.ru/images/big_size_comm/2012-06_6/13407242629490.jpg) http://www.pspx.ru/forum/attachment.php?attachmentid=7928 (http://s.pikabu.ru/images/big_size_comm/2012-06_6/13407242629490.jpg)

Пока нравится моя, как более наглядная и бросающаяся в глаза.
И ещё зелёненькая, но мелковатая и плохо видимая, т.е. пользователь не сразу поймёт, что это такое и для чего.

Всё равно, моя лучше и я бы ей дал бы 1-ое место!!!

Какие ещё будут предложения? А то пришли, обосрали и ушли, а сами предложить чего-то более стоящего не могли )))

KirJan-DeSign
29.10.2012, 21:37
[QUOTE=ErikPshat;1052626]Ну давай потестим, какая лучше подходит...


http://www.pspx.ru/forum/attachment.php?attachmentid=7925 (http://s.pikabu.ru/images/big_size_comm/2012-06_6/13407242629490.jpg) http://www.pspx.ru/forum/attachment.php?attachmentid=7928 (http://s.pikabu.ru/images/big_size_comm/2012-06_6/13407242629490.jpg)

ну вот ВТОРАЯ с анимацией как на телефонах или камерах уже настраивает на манипуляции с картинкой), и ПЕРВАЯ с зелёным плюсиком вроде норм.

KirJan-DeSign
29.10.2012, 21:40
моя меньше и ненавязчива))) :Р

ПОСТАВЬ МОЮ (одну из двух)!!! =))))

ErikPshat
29.10.2012, 21:43
Может так?

http://www.pspx.ru/forum/images/smilies/indeec.gif (http://s.pikabu.ru/images/big_size_comm/2012-06_6/13407242629490.jpg)

KirJan-DeSign
29.10.2012, 21:44
ErikPshat,
уввжаемммый, я нассстаииваю....
http://www.pspx.ru/forum/showpost.php?p=1052627&postcount=12

vash
29.10.2012, 21:45
Хм, так код ведь есть, а лупу можно вписать самому, кака понравится и на что фантазии хватит. Как бэ.

KirJan-DeSign
29.10.2012, 21:46
vash,
нифига, это в расширенном коде будет! одна на всех, ниипёт)))

KirJan-DeSign
29.10.2012, 21:52
<img src="http://www.pspx.ru/forum/images/smilies/indeec.gif" width="80px"><?if($DATE$="Сегодня")?><img src="http://www.pspx.ru/forum/attachment.php?attachmentid=7928" height="34" style="font-weight: bold; padding:3px; border-radius:3px; -moz-border-radius:3px; -webkit-border-radius:3px; margin-left:39px; margin-top:-3px; position: absolute; width:35px;"> <?endif?></img>

ErikPshat
29.10.2012, 21:53
Хм, так код ведь есть, а лупу можно вписать самому, кака понравится и на что фантазии хватит. Как бэ.
Нет, посмотри на код: http://www.pspx.ru/forum/showpost.php?p=1052595&postcount=7

Кнопка http://www.pspx.ru/forum/cleardoc/buttons/edit.gif или http://www.pspx.ru/forum/cleardoc/buttons/quote.gif у вас работает?

Сам HTML-код я уже встроил на сайт.

KirJan-DeSign
29.10.2012, 21:57
ErikPshat,
а вот написано "нажать для увеличения", а он уменьшается :troll:

http://www.pspx.ru/forum/images/smilies/indeec.gif

кнопки работают, гадом буду)

ErikPshat,
чё я там за бред в коде (http://www.pspx.ru/forum/showpost.php?p=1052634&postcount=18) написал? спи3дил где-то)

ErikPshat
29.10.2012, 22:00
ОК! Вот эта мне нравится. Она и анимированная, и видно, что сама миниатюра не анимированная, а иконка "настроек" крутится )))

http://www.pspx.ru/forum/attachment.php?attachmentid=7928 (http://s.pikabu.ru/images/big_size_comm/2012-06_6/13407242629490.jpg)

ну вот ВТОРАЯ с анимацией как на телефонах или камерах уже настраивает на манипуляции с картинкой), и ПЕРВАЯ с зелёным плюсиком вроде норм.

А ваще мне индеец понравился :)

KirJan-DeSign
29.10.2012, 22:02
ОК! Вот эта мне нравится. Она и анимированная, и видно, что сама миниатюра не анимированная, а иконка "настроек" крутится )

ну спасибо)))
а что по поводу бреда ?:
http://www.pspx.ru/forum/showpost.php?p=1052634&postcount=18

ErikPshat
29.10.2012, 22:08
а что по поводу бреда ?:
http://www.pspx.ru/forum/showpost.php?p=1052634&postcount=18
Ну это уже наш BB-код преобразуется в HTML. Там же код Декора уже написан на HTML, это он и есть.

Здесь же, BB-код [RESIZE] написан другим способом, без Декора, правда пришлось ещё добавлять внутрь таблицу, т.к. лупа никак не хотела перемещаться в правый внерхний угол.

KirJan-DeSign
29.10.2012, 22:12
ErikPshat,
а, просто там, где я код стащил (не с нашими сылками)), написано, что иконка в углу картинки пропадает после 00-00. типа код для новостей написан. а вместо лупы там:

http://s019.radikal.ru/i616/1205/57/3a208721f85e.png

или нам это нафиг не надо?

ErikPshat
29.10.2012, 22:28
<img src="http://www.pspx.ru/forum/images/smilies/indeec.gif" width="80px"><?if($DATE$="Сегодня")?><img src="http://www.pspx.ru/forum/attachment.php?attachmentid=7928" height="34" style="font-weight: bold; padding:3px; border-radius:3px; -moz-border-radius:3px; -webkit-border-radius:3px; margin-left:39px; margin-top:-3px; position: absolute; width:35px;"> <?endif?></img>Какой-то бредовый код ты выдернул тут.

Смотреть нужно в 2-е области: слева код, а справа стили. Стили CSS как раз применяются в декоре, а код в HTML.

Вот: http://img542.**************/img542/9093/29102012221146.png

http://img542.**************/img542/9093/29102012221146.png

Ну вот твоя шестерёнка появилась :D

KirJan-DeSign
29.10.2012, 22:29
Какой-то бредовый код ты выдернул тут.
я так и думал) сам не понимаю, что к чему...на вебочке увидел...ага, от юкоза которая.

да и фиг с ними! ) главное - шестерёнка)
во как можно: на колесо нажимаешь - картинка увеличивается, на картинку нажимаешь - на сайт переходишь)
http://ru.playstation.com/media/ueEZwXFI/ps_vita_beauty.png (http://ru.playstation.com/)

http://radioyandex.3dn.ru/clock.swf

http://img39.**************/img39/7981/29102012224152.png

in1975
17.06.2017, 01:52
Что не так?


http работает:
ок

https не работает:

ErikPshat
17.06.2017, 02:19
https не работаетну https - это защищённое соединение. Видимо поэтому накладывает какие-то ограничения.

http://www.pspx.ru/forum/images/icons/zoom.png (http://extreme-modding.de/PS4/database/apps/image10.jpg)