javascript - CUFON 不适用于超大 slider

标签 javascript jquery html css cufon

我正在使用超大型 jQuery slider 插件,它会在单击 NAV anchor 时改变一个 slider

超大 jQuery 插件:::::::::>

    <script type="text/javascript">
        jQuery(function($){
            $.supersized({
                // Functionality
                slide_interval      :   8000,       // Length between transitions
                transition          :   1,          // 0-None, 1-Fade, 2-Slide Top, 3-Slide Right, 4-Slide Bottom, 5-Slide Left, 6-Carousel Right, 7-Carousel Left
                transition_speed    :   1300,       // Speed of transition
                // Components                           
                slide_links         :   'blank',    // Individual links for each slide (Options: false, 'num', 'name', 'blank')
                slides              :   [           // Slideshow Images
                                                    {image : './lib/images/photos/image1.jpg'},
                                                    {image : './lib/images/photos/image2.jpg'},
                                                    {image : './lib/images/photos/image3.jpg'},
                                                    {image : './lib/images/photos/image4.jpg'}
                                            ],

                bullet: "bullet",
                bullet_active: "active",
                bullet_main: "bullet-main",
                bullet_main_active: "active",
                bullet_main_second: "bullet-main-second1",
                bullet_main_second_active: "active2"
            });
        });
    </script>

bullet_main_second_active:“active2”是活跃的主播。

现在的问题是 CUFON 在转换后无法正常工作。有一个错误......它不是停用的前一个 anchor 。将鼠标悬停在上一个 anchor 后,它将颜色更改为默认... slider 插件在默认字体系列上工作正常....它的 cufon 错误

<script type="text/javascript">  
    Cufon('.block-right a h1');
    Cufon.replace('#nav li a');
    Cufon.replace('#rightcaption a', {
        hover: {
            color: '#f04037'
        }
        });
        Cufon.replace('ul.tabNavigation li a', {
        hover: {
            color: '#FFF'
        }
        });
</script>

CSS::::::::::::::>

#rightcaption {
    float:right;
    padding-top:25%;
    font-size:14px;
    color:#b5b5b5;
    margin-right:40px;}
#rightcaption a {
    background:url(../images/bullet1.png) no-repeat right 8px;
    height:8px;
    color:#b5b5b5;
    font-size:14px;
    margin:0 0 5px 0;
    padding:4px 40px 13px 13px;
    display:block;
    text-align:right;}
a.active2 {
    background:url(../images/bullet2.png) no-repeat right 8px #FFF !important;
    margin:0 20px 5px 0;
    color:#f04037;
    font-size:14px;
    padding:4px 40px 13px 13px !important;
    display:block;}

img::::::::::::::::::> http://i.stack.imgur.com/lyjvw.png

最佳答案

如果我真的理解你的问题,那么我会说 cuffon 有一个方法,必须在任何元素更改后(在任何转换之后)使用/调用才能生效,我认为你错过了那个,所以你可以在你的转换完成后调用它

Cufon.refresh(); //Refresh elements that are using coffon font to apply new style

我认为,您必须以某种方式在每次转换后调用回调函数。这是关于 SO about cuffon 的答案这是关于 SO about supersized 的答案(由插件作者回答),这些可能会有所帮助。

关于javascript - CUFON 不适用于超大 slider ,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10046434/

相关文章:

javascript - Jquery .on 事件未在 Chrome 中触发

javascript - 如何防止 ng-click 在 label 标签上触发两次?

javascript - 检查两个输入字段中至少之一有数据

html - CSS:100% 大于页面宽度?

javascript - 使文本适合 HTML5 Canvas?

JavaScript:JXON 转换, "@"是否有原因?

javascript - 是否可以将图像放置在屏幕中央而不是浏览器中央?

jquery - 侧边栏带有纯 CSS 的侧边距?

javascript - Angular JS 教程 - 需要澄清

javascript - RegExp 通配符不应覆盖