Хаки и Скрипты Next Generation CMS : Диалоги и lightbox, JS : Хак - Highslide JS

irbees2008 Опубликовано - 16 - февраля Диалоги и lightbox

Автор: http://highslide.com
Обсудить на :на форуме
Адаптировал: netduke и d7p4x
Уровень сложности исполнения: это делается простым копированием и нажиманием кнопки
Демо:

Хак - Highslide JS - модные превьюшки

1) На своем сайте в папке engine создайте папку hacks.

2) Скачайте архив из аттача и распакуйте его в только что созданную папку hacks.
У вас должен получиться результирующий путь

Код:

 http://site.ru/engine/hacks/highslide/highslide.js

, где site.ru – имя вашего сайта.

3) Откройте файл main.tpl используемого вами шаблона (например, /templates/default/main.tpl) и сразу после htmlvars добавьте:

Код:

<style type="text/css" media="all">
@import url(http://site.ru/engine/hacks/highslide/highslide.css);
</style>
<!-- highslide start  -->
<script type="text/javascript" src="http://site.ru/engine/hacks/highslide/highslide.js"></script>
<script type="text/javascript">
    hs.graphicsDir = 'http://site.ru/engine/hacks/highslide/graphics/';
</script>
<!-- highslide end  -->

заменяя site.ru на имя вашего сайта.

4) Откройте файл engine/lang/russian/admin/images.ini и замените строки:

Код:

insert_thumb    =    "<img="{thumb_url}" border="0" align="">{file_name}</img>"
insert_file    =    "<img="{file_url}" border="0" width="{image_width}" height="{image_height}" align="">{file_name} ({fsize})</img>"

на:

Код:

insert_thumb    =    "<url="{file_url}" onclick="return hs.expand (this)"  class="highslide"><img="{thumb_url}" class="nimg" border="0" align="">{file_name} ({fsize})</img></url>"
insert_file    =    "<img="{file_url}" border="0" width="{image_width}" height="{image_height}" align="">{file_name} ({fsize})</img>"

5) 5) Откройте файл engine/includes/classes/parse.class.php, найдите в нем строки (!!!!! Для моей версии именно эти строки в районе -+ 366, дело в том что в файле parse.class.php похожие строки есть еще в районе -+255 и часто ставят после них что и есть роковая ошибкой)):

Код:

case 'title':
$v = str_replace(array("\"", ord(0), ord(9), ord(10), ord(13), ":", '<', '>', '&'),array("'",''),$kv);
$outkeys [] = $kn.'="'.$v.'"';
break;

и ниже добавьте:

Код:

case 'onclick':
$v = str_replace(array(ord(0), ord(9), ord(10), ord(13), "'", "\"", ";", ":", '<', '>', '&'),'',$kv);
$outkeys [] = $kn.'="'.$v.'"';
break;

Вот и вся установка. Теперь, когда вы будете добавлять в ваши новости превью, для их увеличения будет использоваться библиотека Highslide JS.
Вы не можете скачивать файлы с нашего сайта ,рекомендуем Вам зарегистрироваться либо войти на сайт под своим именем.

Можешь почитать и вот эту статейку "Аннимированный 3D прогресс бар на CSS3"

Это тоже интересно

bloodic 3.11.2015 - 06:42 добрый день! при нажатии на скачивание файла - перебрасует на главную страницу сайта. почините пожалуйста :)

ответить

irbees2008 3.11.2015 - 14:41 bloodic, исправил

ответить

bloodic 4.11.2015 - 06:22 irbees2008, спасибо))добавил это к выводу изображений через xfields - вообще красота :)

ответить

irbees2008 4.11.2015 - 22:43 bloodic, по мне так он слишком тяжелый,есть варианты по легче )

ответить

bloodic 5.11.2015 - 03:12 irbees2008, ну я на форуме находил еще lightbox вроде так называется вывод, но он вообще как крокодил громоздкий)) мне бы еще как на дле после увеличиния картинки кнопочки листать их и вообще цены не было :) не сталкивался с таким?

ответить

irbees2008 5.11.2015 - 11:22 bloodic, http://ngcmshak.ru/dialogi-overlay-i-lightbox/budem-stavit-lightbox-2.html

ответить

bloodic 5.11.2015 - 21:30 irbees2008, тоесть лучше все-таки отказаться от хайслайд и поставить лайтбокс? быстрей работать будет? за ссылку спасибо :)

ответить

irbees2008 5.11.2015 - 23:57 bloodic,это зависит от тебя ,листание есть и в том скрипте вот примеры http://highslide.com/

ответить

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