Moodle在moodle页面计时器样式中添加计时器无法正常工作

时间:2015-08-18 17:06:16

标签: javascript jquery timer moodle

我正在使用jQuery Countdown Timer & Digital Clock Plugin进入我的moodle页面,如下所示:

我的代码如下:

<?php

require_once('../../config.php');
global $DB;
global $COURSE;
$courseid = $COURSE->id;

if (!$course = $DB->get_record('course', array('id' => $courseid))) {
    print_error('invalidcourse', 'block_eparticipation', $courseid);
}

require_login($course);
$PAGE->set_url('/blocks/eparticipation/view.php', array('id' => $courseid));
$PAGE->set_pagelayout('standard');
echo $OUTPUT->header();
?>
<html>
    <head>
                <link rel="stylesheet" type="text/css" href="http://www.jqueryscript.net/demo/jQuery-Countdown-Timer-Digital-Clock-Plugin-timeTo/timeTo.css">

               <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>

                <script src="http://www.jqueryscript.net/demo/jQuery-Countdown-Timer-Digital-Clock-Plugin-timeTo/jquery.timeTo.js"></script>  

                <script src="http://www.jqueryscript.net/demo/jQuery-Countdown-Timer-Digital-Clock-Plugin-timeTo/jquery.timeTo.min.js"></script>

                <script>
                    $(document).ready(function(){
                        $('#timerdiv').timeTo({
                            seconds: 60,
                            displayHours: false,
                            countdownAlertLimit: 5,
                            callback: function () {

                            }
                    });
                    });
                 </script>

    </head>
    <body>
        <div id="timerdiv"></div>
    </body>
<?php echo $OUTPUT->footer(); ?>
</html>

但它与moodle页面发生冲突,我得到一个未正确显示的计时器,如下所示: Image

请在此处查看计时器API:API TIMER

如何在API文件中进行必要的更改,以便它在Moodle页面上正常工作。

**Note:** If I remove `echo $OUTPUT->header();` and `echo $OUTPUT->footer();` from my page then timer works correctly without crashing style.

我该如何纠正?

Moodle版本:2.9.1

0 个答案:

没有答案