4

ピクセルをパーセントに変換する方法があるかどうか知りたい...全幅の値を正常に取得するコードがありますが、オブジェクトを中央に保持する唯一の方法は、パーセントを使用する必要があることです。

これは、後でパーセントに変換する必要がある幅の値を取得するために使用するものです。

$(document).ready(function(){
    var sp = $('.slide'),
        winWidth = $('#slides').width();
        console.log(winWidth);

    sp.css('width', winWidth);
});

助けてくれてありがとう。

これが更新されたフィドルリンクです。 *注: ここで必要だったのは、".slide" コンテナーを流動的に設定して、オブジェクトを中央のスポットに静止させることでした。私のフィドルを自由に変更してください。現在、指定されたjQueryコードを使用して、「#slide」の正確な幅をピクセルに対するパーセント(「.slide」)で取得しています。その後、ブラウザーのサイズを変更して、スライド フレームの出力を確認してください。SlidesJSプラグインFYIを使用しています。

4

5 に答える 5

8
percent = ($("#your_element").width() / $("#some_parent_id").width()) * 100

どこ$("#your_element")で幅をカウントしたい要素%、どこで$("#some_parent_id")は幅をカウントしたい相対的な要素です。

于 2012-11-14T05:03:30.607 に答える
3

パーセンテージは、ピクセル単位の実際の値( によって取得).widthを、ブロックのピクセル単位の幅の値 ( によって取得される可能性があります) で割り、$("#slides").parent().width()100 を掛けた値になります。

于 2012-11-14T05:02:41.563 に答える
1

これを試して:

 $(document).ready(function(){
        var sp = $('.slide'),
            winWidth = $('#slides').width(),
        wWidth = $(window).width();
        sp.width(((winWidth / wWidth) * 100)+'%');
    });
于 2012-11-14T10:47:08.263 に答える
0

OK、「#slides」は幅の値を取得する必要がある正しい要素ではないことがわかりました。これは、代わりにスライドフレームの一部でもあったため、イベントブラウザーの画面サイズの値を取得する必要があります。ブラウザ画面のサイズが変更されるたびに値。

このリンクをチェックして、更新されたフィドルを確認してください。 更新されたフィドルソース

これは、私の問題を修正するのに役立つコードです。

$(window).resize(function() {
  var sp = $('#slides .slide');
  console.log(document.body.clientWidth);
  winWidth = document.body.clientWidth;
  sp.css('width', winWidth);
});

その場合、中央のオブジェクトが同じ場所に留まることなく、幅を完全にサイズ変更し、クラス要素の幅を自動調整できます。:)

于 2012-11-14T08:04:40.733 に答える