Добавление заголовка в фантазии поле

Question

Привет вы, вероятно, думаете, что это глупый вопрос, но я пытаюсь получить заголовки добавлены в фантазии поле 2. Я очень мало знаю о Javascript, но есть это в нижней части моего HTML

<script type="text/javascript"> 
$(document).ready(function() { 
    $(".fancybox").fancybox(); 
}); 
</script> 

И если я пытаюсь добавить в

$(".fancybox") 
.attr('rel', 'gallery') 
.fancybox({ 
    beforeLoad: function() { 
     this.title = $(this.element).attr('caption'); 
} 
}); 

Я получаю все виды ошибок синтаксиса.

Сайт: http://bit.ly/Wan5kr

Answer 1

Ваш текущий сценарий:

$(document).ready(function() { 
    $(".fancybox").fancybox({ 
    helpers : { 
    title : { type : 'inside' } 
    }, // helpers 
    afterLoad : function() { 
    this.title = (this.title ? '' + this.title + '<br />' : '') + 'Image ' + (this.index + 1) + ' of ' + this.group.length; 
    } // afterLoad 
    }); // fancybox 
}); // ready 

... но должно быть (если вы не хотят иметь «страница 1 из 6»):

$(document).ready(function() { 
    $(".fancybox").fancybox({ 
    helpers : { 
    title : { type : 'inside' } 
    } // helpers 
    }); // fancybox 
}); // ready 

с другой стороны, если вы предпочитаете использовать атрибут caption (потому что title показывает, как подсказке при наведении ИМА о.э.р.) изменение title по caption как

<a href="images/Gallery/large/wing-back-chair.jpg" caption="Early 1900'....." rel="Sold" class="fancybox"><img width="304" height="350" alt="Winged back chair and ottoman" src="images/Gallery/tn/wing-back-chair.jpg"></a> 

и использовать этот скрипт

$(document).ready(function() { 
    $(".fancybox").fancybox({ 
    helpers : { 
    title : { type : 'inside' } 
    }, // helpers 
    beforeLoad: function() { 
    this.title = $(this.element).attr('caption'); 
    } 
    }); // fancybox 
}); // ready 

Answer 2

один (и самый простой) вариант, чтобы установить атрибут Tittle родительского HREF.

Так же, как:

<a href="./bigimg/image.jpg" title="My custom title here" id="example"> 
    <img src="./thumbs/image.jpg" alt="thumbnail of image"> 
</a> 

Если вы хотите поместить название внутри осветителя, а не прямо под ним, вы должны изменить атрибут «titlePostion». Точно так же:

$("a.fancybox").fancybox({ 
    'titlePosition' : 'inside' 
}); 

Вместо «над» вы также можете поместить его «внутри» или «снаружи». Снаружи - поведение fancybox по умолчанию. Он позиционирует ваш заголовок прямо ниже (снаружи) лайтбокса. «Над» помещает заголовок внутри лайтбокса, но поверх изображения с темным альфа-прозрачным фоном. «Внутри» помещает ваш заголовок внутри лайтбокса, но ниже картинки, на границе белого лайтбокса.

На первой странице представлены fancybox.net. Смотрите три картины в: «разных позиций название -„снаружи“,„внутри“и„над“»