需要在javascript onload中调用此函数

时间:2012-11-30 20:08:52

标签: javascript html css function call

如何将此函数onLoad调用为url?

function fadeLoop() {

    var counter = 0,
        divs = $('.fader').hide(),
        dur = 500;

    function showDiv() {
        divs.fadeOut(dur) // hide all divs
            .filter(function(index) {
                return index == counter % divs.length;
            }) // figure out correct div to show
            .delay(dur) // delay until fadeout is finished
            .fadeIn(dur); // and show it
        counter++;
    }; // function to loop through divs and show correct div
    showDiv(); // show first div    
    return setInterval(function() {
        showDiv(); // show next div
    }, 5 * 1000); // do this every 5 seconds     };

$(function() {
    var interval;

    $("#start").click(function() {
        if (interval == undefined){
            interval = fadeLoop();
            $(this).val("Stop");
        }
        else{
            clearInterval(interval);
            $(this).val("Start");
            interval = undefined;
        }
    }); });​

此功能激活我的交互式工具提示;但是,我不知道如何调用它,另外我需要将它放在标题或页面中吗?脚本在页面上,链接在标题上...想法?

提前致谢。

克里斯

3 个答案:

答案 0 :(得分:3)

像这样调用函数:

$(document).ready(function(){
fadeLoop()
});


Edit

看起来这个函数被点击事件激活了吗?为什么不将上述内容更改为:

$(document).ready(function(){
       $('#start').trigger('click');
    });

答案 1 :(得分:1)

Jquery的。

function fadeLoop() {
    ....
});​

$(window).on('load', fadeLoop);

答案 2 :(得分:0)

感谢大家的帮助。这是完成的工作代码,享受!!

</script>
<script src="jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
fadeLoop()
function fadeLoop() {

    var counter = 0,
        divs = $('.fader').hide(),
        dur = 300;

    function showDiv() {
        $("div.fader").fadeOut(dur) // hide all divs
            .filter(function(index) {
                return index == counter % divs.length;
            }) // figure out correct div to show
            .delay(dur) // delay until fadeout is finished
            .fadeIn(dur); // and show it
        counter++;
    }; // function to loop through divs and show correct div
    showDiv(); // show first div    
    return setInterval(function() {
        showDiv(); // show next div
    }, 7 * 1000); // do this every 5 seconds    
};

$(function() {
    var interval;

    $("#start").click(function() {
        if (interval == undefined){
            interval = fadeLoop();
            $(this).val("Stop");
        }
        else{
            clearInterval(interval);
            $(this).val("Start");
            interval = undefined;
        }
    });
});
});
</script>
<!--#include file="header.asp"-->
<% if Request("interactive") = "on" then %>
<form name="tutorial">

<div class="fader"><div class="arrow-w arrowlocation1" style="font-size:1em;" ></div><div id="tutorial1" class="tutorial createquestion1">Start by creating a title and selecting a folder for your question to be stored in.</div></div>

<div class="fader"><div class="arrow-w arrowlocation2" style="font-size:1em;" ></div>
<div id="tutorial2" class="tutorial createquestion2">Categories are key to your reporting effectiveness, be sure to include categories that relate to this question.</div></div>

<div class="fader"><div class="arrow-w arrowlocation3" style="font-size:1em;" ></div>
<div id="tutorial3" class="tutorial createquestion3">Select your options and/or upload an attachment (file, video or audio).</div></div>

<div class="fader"><div class="quicktiptitle quicktiplocation4">QUICK TIP</div><div class="arrow-n arrowlocation4" style="font-size:1em;" ></div>
<div id="tutorial4" class="quicktip createquestion4">To create questions easier update your question preferences in your account area options.</div></div>

<div class="fader"><div class="arrow-w arrowlocation5" style="font-size:1em;" ></div>
<div id="tutorial5" class="tutorial createquestion5">Your rationale can be used to provide feedback to students on this question and you also can use internal comment to track notes on changes, updates, textbook information and more.</div></div>

<div class="fader"><div class="arrow-e arrowlocation6" style="font-size:1em;" ></div>
<div id="tutorial6" class="tutorial createquestion6">Write your questions, answers and you are ready to go.</div></div>

<div class="fader"><div class="arrow-w arrowlocation7" style="font-size:1em;" ></div>
<div class="quicktiptitle quicktiplocation7">QUICK TIP</div>
<div id="tutorial7" class="quicktip createquestion7"> Click on this icon to open and close sections that you don't use. These will remain closed whenever you visit this page until you open them again.</div></div></form>


<% end if %>