Я хочу добавить изображения в мою галерею лайтбоксов, используя ссылки javascript. например, я пробовал,
<script>
imageArray =[
"image1.jpg",
"image2.jpg",
"image3.jpg"
];
function assignUrl(img_num)
{
return "www.website/images/" + imageArray[img_num];
}
</script>
И в моей галерее я использовал,
<a href="javascript:document.location.href=assignUrl(0);"
data-lightbox="imagegallery" >
<img src="javascript:document.location.href=assignUrl(0);" <!-- thumbnail-->
</a>
Но это не работает. Миниатюра не отображается, и когда вы нажимаете кнопку, изображение продолжает загружаться, но ничего не происходит.
Когда я использую тестовую ссылку, подобную этой, она отображает изображение.
<a href="javascript:document.location.href=assignUrl(0);"> TEST </a>
Пожалуйста помоги? Что я делаю не так? Есть ли другой обходной путь?
Я написал пример функции для динамического создания и добавления элементов и img на основе переменной imageArray. Затем активируйте плагин, вызвав функцию лайтбокса.
Я не хотел касаться вашего кода как можно больше.
Вот как это выглядит:
<script>
imageArray =[
"image1.jpg",
"image2.jpg",
"image3.jpg"
];
function assignUrl(img_num)
{
return "www.website/images/" + imageArray[img_num];
}
$(function() {
for (var i = 0; i < imageArray.length; i++){
var div = $("<a/>").attr("href",assignUrl(i)).attr("data-lightbox","imageGallery");
div.append($("<img/>").attr("src",assignUrl(i)).attr("width","20%").attr("height","20%"));
console.log($);
$("body").append(div);
}
$('a[rel="lightbox"]').lightBox();
});
</script>
Сценарий: http://jsfiddle.net/nilgundag/jTDk9/7/