Конфликт с использованием атрибута rel в mootools - PullRequest
Новая
       20

Конфликт с использованием атрибута rel в mootools

1 голос
/ 19 января 2012

В поисках понимания этой проблемы.

У меня есть динамически сгенерированные ссылки на странице, которые запускают лайтбокс, т.е. они используют rel = "lightbox [...]". Я также помещаю класс в гиперссылку, чтобы заставить всплывающую подсказку работать. 

<a id="a_-1_6" class="Tips2" href="/media/63/forest_150.jpg" rel="lightbox[examples]" data-title="Tractor" data-desc="description..." data-rel="std" title="" style="opacity: 1; visibility: visible;">

А в Доме готово событие 

                var Tips2 = new Tips($$('.Tips2'), {
                initialize: function() { this.tip.fade('hide'); },
                onShow: function(tip) { tip.fade('in');  },
                onHide: function(tip) { tip.fade('out'); }
            });

Это все работает нормально, за исключением того, что tip использует атрибут rel для хранения данных, я полагаю, что это как pre-html5 - поэтому мой вопрос заключается в том, означает ли это, что мне нужно сделать собственную версию класса Tips в mootools отработать данные. * атрибуты? Я хотел бы видеть, что я не лаю не на то дерево, прежде чем я попробую это.

Спасибо

Ответы [ 2 ]

1 голос
/ 19 января 2012

Не могли бы вы сделать еще один элемент внутри Ahref, например: 

<a id="a_-1_6" href="/media/63/forest_150.jpg" rel="lightbox[examples]" data-title="Tractor" data-desc="description..." data-rel="std" title="" style="opacity: 1; visibility: visible;">
    <span class="Tips2">blah</span>
</a>

Таким образом, вы можете избежать конфликта.

0 голосов
/ 20 января 2012

Tips 'документация гласит, что вы можете изменить, какое свойство проверяется для текста подсказки.По умолчанию это rel или href, но вы можете изменить его при инициализации нового совета: 

var Tips2 = new Tips($$('.Tips2'), {
    initialize: function() { this.tip.fade('hide'); },
    onShow: function(tip) { tip.fade('in');  },
    onHide: function(tip) { tip.fade('out'); },
    text: 'data-text'        // Will now check the data-text property for tooltip text
});
...