jQuery 工具选项卡——改变背景颜色

标签 jquery css jquery-tools flowplayer

我正在使用这个设置: http://flowplayer.org/tools/demos/tabs/slideshow.htm

我想在从一个选项卡切换到另一个选项卡时更改 BODY 背景,用一种特定的颜色来匹配每个选项卡。

有人可以让我知道我需要添加哪些额外的代码吗?

如果有任何帮助,我将不胜感激,因为我对 JS 一点都不流利,尽管我对 HTML/CSS 相当熟练;)

非常感谢。

最佳答案

你真的应该看看 events documentation .

我的猜测是绑定(bind)到 onClick 和/或 onBeforeClick 并且可能使用 data-bgColor="#FFF"-type 属性在每个选项卡上,然后将该值定位(并应用)到这些事件之一的正文背景中。像这样的东西:

<!-- first slide -->
<div data-bgcolor="#FF0000"> ... </div>

<!-- second slide -->
<div data-bgcolor="#00FF00"> ... </div>

<!-- third slide -->
<div data-bgcolor="#0000FF"> ... </div>

和:

$('.tabs').tabs(".images > div", {
  // ...
  // other properties applied
  // ...

  onBeforeClick: function(event,tabIndex){
    // /* pseudo-code */
    // var bg = $(event.element).data('bgcolor');
    // $('body').css('background-color', bg);
  }
});

关于jQuery 工具选项卡——改变背景颜色,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/9485964/

相关文章:

jquery - 如何让垂直渐变背景适用于所有浏览器?

html - 当宽度设置为百分比时,CSS 省略号不起作用

html - 使用 100vw 和 vh 会创建超出视口(viewport)大小的额外空间。我该如何摆脱它?

javascript - Jquery 工具在 Webkit 中不工作

jQuery:创建的按钮具有与第一个按钮相同的效果

javascript - 如何将 jQuery 对象分配给变量?

javascript - 表格的 jQuery 幻灯片动画

html - 在网格中平均分配固定宽度的 div

Jquery 覆盖默认定位

html - Jquery 工具提示错位