jQuery оверлей Apple, используя <a>?

Question

относительно jQuery Tools Демонстрация Apple Overlay

Как использовать текстовую ссылку <A> для запуска оверлея вместо IMG?

Answer 1

Вам просто нужно изменить селектор jquery, чтобы идентифицировать вашу ссылку (или любой тип объекта в этом отношении).

Изменение:

$("#apple img[rel]").overlay({effect: 'apple'});

Кому:

$("#apple_link").overlay({effect: 'apple'});//selects a single link with an id of 'apple_link'

или

$("a[rel]").overlay({effect: 'apple'});//selects all links with a rel attribute

Где 'apple_link' - это идентификатор ссылки, также добавьте атрибут rel к ссылке следующим образом:

<a href='#' rel='div_to_open' id='apple_link'>Link Text</a>

Примечание: значение rel - это div, который будет открыт в оверлее

Answer 2

Вы имеете в виду, как в это демо ?

$("a[rel]").overlay({

    mask: 'darkred',
    effect: 'apple',

    onBeforeLoad: function() {

    // grab wrapper element inside content
    var wrap = this.getOverlay().find(".contentWrap");

    // load the page specified in the trigger
    wrap.load(this.getTrigger().attr("href"));
    }
});