0

div で動的に幅を設定しようとしています。これは、Safari、Chrome、および Firefox では正しく機能しますが、IE8 では機能しません。これは、スライダー機能に jQuery UI を使用しています。これまでの私のコードは次のとおりです。

var ourStoryPosts = $(".ourStory .grid_12mod").children();
var ourStoryLength = ourStoryPosts.length;
var ourStoryWidth = $(ourStoryPosts[2]).outerWidth(true);
var ourStoryWrapperWidth = ourStoryLength * ourStoryWidth;
var maxSlider = ourStoryWrapperWidth - 1020;

$(".ourStory .grid_12mod").width(ourStoryWrapperWidth);

$(".ourStorySlider").slider({ 
    step: 1, 
    max: maxSlider,
    slide: function( event, ui) {
        $(".ourStory").css({
            "left" : -ui.value
        });
    }
});

ご覧のとおり、変数を使用してこれらの値を設定しています。width()メソッドが期待どおりに機能していません。

コンストラクターを使用しString()て明示的に文字列にキャストしようとしました。+ "px"式の最後にも使ってみました。毎回、div が に設定されてい0pxます。これが正しく機能しないのはなぜですか?

4

2 に答える 2

0

cssプロパティの幅を設定してみてください。

$(".ourStory .grid_12mod").css('width', ourStoryWrapperWidth.toString() + 'px');
于 2013-03-06T15:50:20.033 に答える
0

Not sure what the actual issue was, but using native JS fixed it for me:

var elem = document.querySelector(".grid_12mod");
var ourStoryChildren = elem.children;

Using the jQuery 1.9 method of children() logged a result of 5 elements in Safari, Chrome and Firefox, while IE8 logged 1. Using the native children attribute of the elem object fixed the problem and logged 5 for all browsers.

The reason this was logging 0 is because IE8 was returning only 1 child element, when 5 existed, therefore the math was off and IE8 was trying to find the second array element when it only found 1 element.

于 2013-03-06T16:19:33.570 に答える