Я использую этот пример highslide для своего сайта: - .
https://www.roadrash.no/hs-support/gallery-in-page-with-large-imagelink-in-caption.html .
Мне нужно добавить еще одну ссылку рядом с существующей ссылкой в области заголовка. Как мне это сделать? .
Большое спасибо.
В этом примере показано, как поместить динамическую, автоматически сгенерированную ссылку в область заголовка. Но вы можете использовать гораздо более прямой подход. Короче говоря, вы можете поместить любой HTML-код в заголовок. Например, миниатюра может выглядеть так, создавая две текстовые ссылки в подписи:
<a href='slides/bears1.jpg' class='highslide' onclick='return hs.expand(this)'>
<img src='thumbs/bears1.jpg' width='124' height='93' alt='bears1' title=''></a>
<div class='highslide-caption'>This is the basic caption.<br>This is <a href='https://cnn.com'>a link to CNN</a>.<br>This is <a href='https://nbcnews.com'>a link to NBC News</a>.</div>
Взгляните на эту новую демонстрацию: https://roadrash.no/hs-support/gallery-in-page-with-large-imagelink-in-caption-and-additional-link.html Это модификация демо вы уже используют.
Замените это в старой демонстрации:
// Inserting link to large image in caption
hs.Expander.prototype.onAfterGetCaption = function(sender) {
if (sender.caption) {
sender.caption.innerHTML += '<br /><a href="' + sender.content.src + '" class="highslide" onclick="return stopSlideshowAndExpand(this, largeImage)">View large image</a>';
}
};
С этим:
// Inserting link to large image and additional link in the caption
hs.Expander.prototype.onAfterGetCaption = function(sender) {
if (sender.caption) {
sender.caption.innerHTML += '<br /><a href="' + sender.content.src + '" class="highslide" onclick="return stopSlideshowAndExpand(this, largeImage)">View large image</a><br /><a href="' + this.custom.url + '" class="highslide" target="_blank"><span style="font-size: 12px; font-style: italic;">Go to ' + this.custom.linktext + ' </span><span style="font-size: 7px; font-style: italic;">(opens in new tab)</span></a>';
}
};
HTML-разметка изображения в новой демонстрации выглядит так:
<a class='highslide' href='images/016.large.jpg' onclick="return hs.expand(this, inPageOptions, {url: 'https://highslide.com/ref/', linktext: 'Highslide API reference page'} )">
<img src='images/016.smallthumb.jpg' alt='Autumn leaves'/>
</a>
Замените содержимое url и linktext своим собственным URL и текстом.
sender.caption.innerHTML += '<br /><a href="' + sender.content.src + '" class="highslide" onclick="return stopSlideshowAndExpand(this, largeImage)">View large image</a><br /><a href="' + this.custom.url + '" class="highslide" target="_blank"><span style="font-size: 12px; font-style: italic;">Go to ' + this.custom.linktext + ' </span><span style="font-size: 7px; font-style: italic;">(opens in new tab)</span></a>'; (продолжение в следующем комментарии --›) 01.06.2013 sender.caption.innerHTML += '<br /><a href="' + sender.content.src + '" class="highslide" onclick="return stopSlideshowAndExpand(this, largeImage)">View large image</a><br /><a href="' + this.custom.url + '" target="_blank" title="Go to ' + this.custom.linktext + '"><img src="your-graphic.png" alt="" style="border: none" /></a>'; 01.06.2013 onAfterGetCaption. 04.08.2013 
