Перейти к содержанию
Официальный форум поддержки Simpla

Вывод форматированного альтернативного текста из БД


Перейти к решению Решено mishanya,

Рекомендуемые сообщения

Здравствуйте.

Нужно вывести текст появляющийся при наведении мыши на картинку/ссылку. Текст, этот должен браться из краткого описания товара. Я это сделал, НО, текст выводится вместе с html-тегами, а нужно что бы текст форматировался по ним. Пример вывода на картинке.

 

Вот как это реализовано в коде:

 

<div class="image">
<span href="products/{$product->url}" title='{$product->annotation}'><img src="{if $product->image}{$product->image->filename|resize:140:150}{else}design/{$settings->theme}/images/bg/nofoto.png{/if}" alt="{$product->name|escape}"/></span>
</div>

 

post-19913-0-01559900-1434269305_thumb.png

Ссылка на сообщение
Поделиться на другие сайты

вы выводите описание в alt, а он не поддерживает никакое форматирование, это простая строка для альтернативного описания.

 

вам нужно сделать какой-то div, который бы появлялся при наведении на фото.

Ссылка на сообщение
Поделиться на другие сайты

вы выводите описание в alt, а он не поддерживает никакое форматирование, это простая строка для альтернативного описания.

 

вам нужно сделать какой-то div, который бы появлялся при наведении на фото.

Да, Я это осознал, Я не могу понять как сделать всплывающий блок, Вы можете привести пример кода?

Ссылка на сообщение
Поделиться на другие сайты
  • Решение
<div class="image">
   <img src="...">
   <div class="img_desc">тут описание</div>
</div>

и css что-то такое

 

.image { }

.image .img_desc { display:none; position:absolute; }
.image:hover .img_desc { display:block; } 

в таком стиле попробуйте.

Ссылка на сообщение
Поделиться на другие сайты

 

<div class="image">
   <img src="...">
   <div class="img_desc">тут описание</div>
</div>

и css что-то такое

 

.image { }

.image .img_desc { display:none; position:absolute; }
.image:hover .img_desc { display:block; } 

в таком стиле попробуйте.

Спасибо, попробую. О результатах доложу позже  :)

Ссылка на сообщение
Поделиться на другие сайты

Поставьте плагин, например http://getbootstrap.com/javascript/#tooltips и при инициализации передайте параметр html=true

$(function () {
  $('[data-toggle="tooltip"]').tooltip({html:true})
})
Изменено пользователем Andrey Terkin
Ссылка на сообщение
Поделиться на другие сайты

 

Поставьте плагин, например http://getbootstrap.com/javascript/#tooltips и при инициализации передайте параметр html=true

$(function () {
  $('[data-toggle="tooltip"]').tooltip({html:true})
})

 

зачем дополнительно нагружать еще сайт js`ом

Ссылка на сообщение
Поделиться на другие сайты

 

<div class="image">
   <img src="...">
   <div class="img_desc">тут описание</div>
</div>

и css что-то такое

 

.image { }

.image .img_desc { display:none; position:absolute; }
.image:hover .img_desc { display:block; } 

в таком стиле попробуйте.

Спасибо, сработало, естественно стили свои напишу.

Ссылка на сообщение
Поделиться на другие сайты

зачем дополнительно нагружать еще сайт js`ом

 

Судя по вопросам и боязни js вы очень молоды в разработке )))) Не бойтесь js, вы перечитали на блогах и сайтах советов 10 летней давности.... у вас, лично у вас на сайте js очень очень много и его меньше раз в 10и более, чем вес картинок в категории с товаром!

 

А вариант ,который вам предложили весит вообще килобайт 15... ср размер картинки 100-200 )))

Ссылка на сообщение
Поделиться на другие сайты

Судя по вопросам и боязни js вы очень молоды в разработке )))) Не бойтесь js, вы перечитали на блогах и сайтах советов 10 летней давности.... у вас, лично у вас на сайте js очень очень много и его меньше раз в 10и более, чем вес картинок в категории с товаром!

 

А вариант ,который вам предложили весит вообще килобайт 15... ср размер картинки 100-200 )))

 

вариант который предложил я, занимает аж ничего. какой смысл человеку еще подключать бутстрап или другой скрипт, если это можно сделать проще. если идти вашим примером, давайте сделаем все на js и каждій ваш вес в килобайт 15 превратиться в мегабайт. если можно обойтись без js почему бы не сделать это.

Ссылка на сообщение
Поделиться на другие сайты

Судя по вопросам и боязни js вы очень молоды в разработке )))) Не бойтесь js, вы перечитали на блогах и сайтах советов 10 летней давности.... у вас, лично у вас на сайте js очень очень много и его меньше раз в 10и более, чем вес картинок в категории с товаром!

 

А вариант ,который вам предложили весит вообще килобайт 15... ср размер картинки 100-200 )))

Конечно, 15К само по себе немного.

Но на такую элементарную задачу, которая решается пятью простенькими строчками в шаблоне, это уже экстремальная расточительность.

Если на каждый подобный пустяк Вы собираетесь грузить по 15К, то быстро вырастет и размер, и уменьшится скорость...

 

И интересно, где это Вы видели "ср размер картинки 100-200"?

Например, тут http://bt.rozetka.com.ua/145865/c145865/ в списке довольно крупные качественные картинки по 20К.

А если в подобном списке будут картинки по 200К, то тормоза покупателю обеспечены...

Ссылка на сообщение
Поделиться на другие сайты

Конечно, 15К само по себе немного.

Но на такую элементарную задачу, которая решается пятью простенькими строчками в шаблоне, это уже экстремальная расточительность.

Если на каждый подобный пустяк Вы собираетесь грузить по 15К, то быстро вырастет и размер, и уменьшится скорость...

 

И интересно, где это Вы видели "ср размер картинки 100-200"?

Например, тут http://bt.rozetka.com.ua/145865/c145865/ в списке довольно крупные качественные картинки по 20К.

А если в подобном списке будут картинки по 200К, то тормоза покупателю обеспечены...

 

о чем и я. видимо Корс, вы тоже очень молоды в разработки и боитесь js =)))

Ссылка на сообщение
Поделиться на другие сайты

Подождем, что скажет уважаемый опытнейший мэтр разработки.

Особенно мне интересно получить ссылки сайтов магазинов, где картинки в среднем по 100-200К.

 

Судя по

http://forum.simplacms.ru/topic/9832-%D0%BF%D0%BE%D0%BC%D0%BE%D0%B3%D0%B8%D1%82%D0%B5-%D0%BF%D0%BE%D0%BD%D1%8F%D1%82%D1%8C-%D0%BE%D1%82%D0%B2%D0%B5%D1%82/page-2?do=findComment&comment=74387

он действительно активно занимается именно процессом РАЗРАБОТКИ, но никак не созданием работающих проектов. Что же,  у каждого свои интересы...

Ссылка на сообщение
Поделиться на другие сайты

Подождем, что скажет уважаемый опытнейший мэтр разработки.

Особенно мне интересно получить ссылки сайтов магазинов, где картинки в среднем по 100-200К.

 

Судя по

http://forum.simplacms.ru/topic/9832-%D0%BF%D0%BE%D0%BC%D0%BE%D0%B3%D0%B8%D1%82%D0%B5-%D0%BF%D0%BE%D0%BD%D1%8F%D1%82%D1%8C-%D0%BE%D1%82%D0%B2%D0%B5%D1%82/page-2?do=findComment&comment=74387

он действительно активно занимается именно процессом РАЗРАБОТКИ, но никак не созданием работающих проектов. Что же,  у каждого свои интересы...

 

Ну хорошо, хорошо.... розетку вы ловко привели в пример ))) 100-200 я загнул... соглашусь

 

мое дело маленькое — покритиковать... буду чуть по сдержаней )

Ссылка на сообщение
Поделиться на другие сайты

Присоединяйтесь к обсуждению

Вы можете написать сейчас и зарегистрироваться позже. Если у вас есть аккаунт, авторизуйтесь, чтобы опубликовать от имени своего аккаунта.

Гость
Ответить в этой теме...

×   Вставлено с форматированием.   Вставить как обычный текст

  Разрешено использовать не более 75 эмодзи.

×   Ваша ссылка была автоматически встроена.   Отображать как обычную ссылку

×   Ваш предыдущий контент был восстановлен.   Очистить редактор

×   Вы не можете вставлять изображения напрямую. Загружайте или вставляйте изображения по ссылке.

Загрузка...
×
×
  • Создать...