JSfiddle没有在网页上工作

时间:2014-05-09 17:08:00

标签: javascript jquery jsfiddle

我有一个Jsfiddle正常工作,但是当我将代码复制到我的网页和CSS,JavaScript文件代码不起作用。有没有人知道如何正确地将代码复制到网页中以正确显示它?感谢

jsfiddle.net/ajs122/dwm3H/38 /

1 个答案:

答案 0 :(得分:1)

当您将代码放入页面时,要么将其放在页面的末尾,在结束正文标记之前,要么将其包装在文档就绪处理程序中:

$( document ).ready(function() {
  // Your code here
});

在jsFiddle.net上,左侧的onLoad选项会自动将您的代码包装在window.load调用中:

$(window).load(function(){
$('#sub').hover(function () {

    // Gurantee that height of sub-menu is 0, cant be seen
    // behind main menu
    var height = $("#slide").height();
    if (height > 0) {
        $('#slide').css('height', '0');
    } else {
        var clone = $('#slide').clone()
            .css({
                // Ensures that the sub-menu can not be 
                // found by the cursor before its parent
                // is hovered
                'visibility': 'hidden',
                // Sub-menu takes up exactly the required 
                // amount of space
                'height': 'auto'
        })
        // Add the new created class to the HTML document    
        .addClass('slideClone')
            .appendTo('body');

        //$("'slide").css({,'visibility':'hidden','height':'auto'});
        //var newHeight = $("#slide").height();
        var newHeight = $(".slideClone").height();
        $(".slideClone").remove();

        $('#slide').css('height', newHeight + 'px');
    }
});

$('#sub2').hover(function () {
    var height = $("#slide2").height();
    if (height > 0) {
        $('#slide2').css('height', '0');
    } else {
        var clone = $('#slide2').clone()
            .css({
            'position': 'absolute',
                'visibility': 'hidden',
                'height': 'auto'
        })
            .addClass('slideClone')
            .appendTo('body');

        var newHeight = $(".slideClone").height();
        $(".slideClone").remove();

        $('#slide2').css('height', newHeight + 'px');
    }
});