5
"при наведении мышки на фотку фотка увеличивается, а при клике переходим на..."
1. копируем файлы
hand16.png -> data/[шаблон]/
highslide.js -> data/[шаблон]/
highslide.js это последняя на момент написания дополнения версия библиотеки, неупакованный вариант.
Штатно используемая в ShopCMS библиотека highslide.packed.js довольно старенькая и не имеет нужных функций, но если Вы давным-давно заменили ее на более новую highslide.packed.js, то, конечно, правильнее ее и использовать отредактировав пункт (2).
2. в файлах category.tpl.html, category_search_result.tpl.html, search_simple.tpl.html в начало вставляем
{* BEGIN HighSlide-category-expand-picture *}
<script type="text/javascript" src="data/{$smarty.const.TPL}/highslide.js"></script>
<script type="text/javascript">
hs.graphicsDir = 'data/{$smarty.const.TPL}/';
hs.outlineType = 'rounded';
hs.showCredits = false;
hs.loadingOpacity = 1;
hs.headingEval = 'this.thumb.alt';
hs.wrapperClassName = 'draggable-header';
hs.restoreCursor = 'hand16.png';
hs.lang.restoreTitle = 'Подробнее..';
hs.lang.loadingText = '{$smarty.const.STRING_HS_LOADINGTEXT}';
hs.lang.loadingTitle = '{$smarty.const.STRING_HS_LOADINGTITLE}';
hs.lang.focusTitle = '{$smarty.const.STRING_HS_FOCUSTITLE}';
hs.lang.fullExpandTitle = '{$smarty.const.STRING_HS_FULLEXPANDTITLE}';
{literal}
hs.Expander.prototype.onMouseOut = function (sender) {sender.close()};
hs.Expander.prototype.onAfterExpand = function (sender) {if (!sender.mouseIsOver) sender.close()}
hs.Expander.prototype.onImageClick = function() {window.location.href = this.custom.url};
{/literal}
</script>
{* BEGIN HighSlide-category-expand-picture *}
3. в файле product_brief.tpl.html вместо
<td class="imboxr"><a href="{if $smarty.const.CONF_MOD_REWRITE eq 1}product_{$product_info.productID}.html{else}index.php?productID={$product_info.productID}{/if}"><img src="data/small/{$product_info.picture}" alt="{$product_info.name}" class="tTip" title="{$product_info.title}"></a></td>
вставляем
{* BEGIN HighSlide-category-expand-picture *}
{*<td class="imboxr"><a href="{if $smarty.const.CONF_MOD_REWRITE eq 1}product_{$product_info.productID}.html{else}index.php?productID={$product_info.productID}{/if}"><img src="data/small/{$product_info.picture}" alt="{$product_info.name}" class="tTip" title="{$product_info.title}"></a></td>*}
<td class="imboxr">
<a href="data/medium/{$product_info.thumbnail}" alt="{$product_info.name}" class="highslide" onmouseover="return hs.expand(this, null, {literal}{{/literal}url: '{if $smarty.const.CONF_MOD_REWRITE eq 1}product_{$product_info.productID}.html{else}index.php?productID={$product_info.productID}{/if}'{literal}}{/literal})">
<img src="data/small/{$product_info.picture}" alt="{$product_info.name}">
</a>
</td>
{* END HighSlide-category-expand-picture *}
Это для картинки справа от описания. Для картинки слева аналогичные действия надо сделать для аналогичной строки,
но с class="imboxl"
Если хочется увеличивать small-картинку в категории не до medium-картинки, а до big-картинки, то замените data/medium/{$product_info.thumbnail} на data/big/{$product_info.big_picture}
PS. а, да, чуть не забыл. Как оно работает можно живьем посмотреть в почти любой категории тестового сайта cpu.badisoft.ru, который в подписи.
Прикрепленные файлы
-
hand16.png 626байт
27 Количество загрузок:
-
highslide.zip 25.35К
16 Количество загрузок:
