JQuery 功能内容 slider 样式问题

Question

我正在尝试重新创建此 JQuery 功能内容 slider :

http://demo.webdeveloperplus.com/featured-content-slider/

当我在 JSFiddle 中重新创建它时，有 2 个样式元素未显示。

http://jsfiddle.net/NinjaSk8ter/6WXkM/

图像标题和图像描述有一个透明的灰色框，显示在主图像的顶部。 ListItem 选项卡还有一个未显示的三 Angular 形指针。

但是在 JSFiddle 中我不知道如何让那个透明的灰色框和指针出现:

我注意到演示版使用的是 jquery-ui.min 1.5.3，我已将其作为托管资源添加到 JSFiddle 版: http://ajax.googleapis.com/ajax/libs/jqueryui/1.5.3/jquery-ui.min.js

Answer 1

你必须修改css:

#featured .ui-tabs-panel .info {
    background: url("images/transparent-bg.png") repeat scroll 0 0 transparent;
    bottom: 0;
    height: 70px;
    left: 0;
    position: absolute;
}

#featured li.ui-tabs-selected{
    background:url('images/selected-item.gif') top left no-repeat;  
}

例如指针在这个地址: http://demo.webdeveloperplus.com/featured-content-slider/images/selected-item.gif

还有这里面的灰框背景: http://demo.webdeveloperplus.com/featured-content-slider/images/transparent-bg.png

检查一下: http://jsfiddle.net/6WXkM/2/

*您必须将此图片替换为您拥有的图片