与 mootools 中 rel 属性的使用冲突

发布于 2024-12-27 21:21:25 字数 756 浏览 1 评论 0原文

寻找对这个问题的一些见解。

我在启动灯箱的页面上动态生成了链接,即它们使用 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;">

在 dom 就绪事件中,

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

这一切都工作正常,除了提示使用 rel 属性来存储数据,我假设它是 html5 之前的版本 - 所以我的问题是这是否意味着我需要制作自己的 Tips 类版本在 mootools 中处理 data.* 属性?在我尝试之前,我想看看我没有找错树。

Looking for some insight into this problem.

I have dynamically generated links on a page that launch a lightbox ie they use a rel="lightbox[...]" I'm also putting a class on the hyperlink to make a tooltip work.

<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;">

And in the dom ready event

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

This all works fine except the tip uses the rel attribute to store data, i'm presuming as its a pre-html5 - so my question is would this mean I need to make my own version of the Tips class in mootools to work off the data.* attributes? I'd like to see I'm not barking up the wrong tree before I try that.

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

丶情人眼里出诗心の 2025-01-03 21:21:25

您可以在 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>

这样,您可以避免冲突。

Could you make another element inside the Ahref, like:

<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>

This way, you can avoid the conflict.

隱形的亼 2025-01-03 21:21:25

提示'文档指出您可以更改检查提示文本的属性。默认情况下,它是 relhref,但您可以在初始化新提示时更改它:

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
});

Tips' documentation states that you can change which property is checked for the tip text. By default, it is rel or href, but you can change it when initializing the new Tip:

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
});
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文