3

只是一个非常简单的问题，但我对 JavaScript 很陌生。我正在尝试在两者上使用 JS 添加一个属性，margin-top但没有运气。divdocument.readywindow.resize

function cent() {
    var blockheight = $("#block").height();
    var margintop = (blockheight / -2);
    $block.css("margin-top", margintop);                   
};

$(document).noConflict();
$(document).ready(cent);
$(window).resize(cent);
4

6 回答 6

1

编辑：

嘿，我拿了你最近的 jsFiddle 并做了一些现在正在工作的更改，它将其转换为原始高度的一半。看一看，看看这是否是你需要的。

抱歉，我的代码没有保存。这是我的 jsFiddle 更新：

我添加了parseInt()保证您收到的高度结果.height()是一个能够在您的部门中解析的整数，以及包装的内部部分$(document)和$(window)匿名函数调用cent();。

function cent() {
    var $block = $("#block"),
        margintop = parseInt($block.height() / -2);
    console.log('called');
    $('#block').css("margin-top", margintop);
};

// $(document).noConflict();
$(document).ready(function(){
    cent();
});
$(window).resize(function(){
    cent();
});

更改

$block.css("margin-top", margintop);

到

$('#block').css("margin-top", margintop);
于 2013-06-12T13:19:53.400 回答
1

一些事情，

你在哪里定义变量$block？您需要将要修改的元素放入该变量中，以便...

   var $block = $('#block');

cent在定义块高度之前在您的函数中。

其次

您需要cent在文档准备好后调用您的函数。

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

与resize...相同，因此总体而言代码应该是这样的。

$(document).ready(function(){
   cent();
   $(window).resize(function(){
      cent();
   });
});

如果您不清楚文档就绪的工作原理，我建议您阅读 jquery api，它非常有用且用户友好。

于 2013-06-12T13:22:50.977 回答
0

看起来你的语法有点不对劲。更改$block为$('#block')。

这个jsFiddle应该可以帮助您解决问题。

于 2013-06-12T13:20:11.590 回答
0

更改：

$block.css("margin-top", margintop);

到：

$('#block').css("margin-top", margintop);

并更改函数调用方法：

    $(document).noConflict();

    //on DOM ready
    $(document).ready(function ()  {
       cent();
    });

    //on window resize
    $(window).resize(function ()  {
       cent();
    });
于 2013-06-12T13:23:28.230 回答
0

你需要设置去哪个单位。.height() 将返回一个数字，而 css 属性 margin-top 需要知道哪个单位。

var margintop = (blockheight / -2) + 'px';
于 2013-06-12T13:31:49.493 回答
0

我使用了 Dylan N 的代码，一切都在 jsfiddle 中工作，但在我的整页中，存在某种冲突。我已将其范围缩小到下面的代码。有谁知道冲突可能是什么？

var $j = jQuery.noConflict();
jQuery(function ($j) {

var image_slides = [];

image_slides.push({
    image: 'img/background.jpg'
})


$j.supersized({



    // Individual links for each slide (Options: false, 'num', 'name', 'blank')

    min_width: 0,
    min_height: 0,
    vertical_center: 1,
    horizontal_center: 1,
    fit_always: 0,
    fit_portrait: 1,
    fit_landscape: 0,
    slides: image_slides,
});
});
于 2013-06-12T13:48:08.017 回答