0

クリッピング ウィンドウを作成しようとしていますが、発生していません。コード サンプルは次のとおりです。

<html>
<head>
    <style>
        #clippingWindow
        {
            height:178px;
            width:278px;
            overflow: hidden;
        }
        #bgImg
        {
            left:35px;
            border:54px;
        }
    </style>
    <script language="javascript">

        function getImgSize()
        {

            var ds = document.getElementsByName('a');
            var wid = ds[0].width;
            var pos = (wid-278)/2;

            alert(pos);
            alert(ds[0].id);

            if(ds[0].width>278)
            {
                dt.style.left=500; //this is not working
            }
        }
    </script>
</head>
<body><input type="button" onClick="getImgSize();">
    <div id="clippingWindow">
        <img name="a" src="sss.bmp" id="bgImg">
    </div><br><br><br>
    <div id="ad">
        <img name="a" src="484.jpeg">
    </div>
</body>
</html>
4

3 に答える 3

2

おそらくposition、配置したい要素のプロパティをabsoluteorのようなものに設定する必要がありますrelative(例: ds.style.position = "relative";)。このleftプロパティは、静的に配置された要素には影響しません。

"500px"また、おそらくnumber の代わりに使用する必要があります500

于 2012-09-25T20:56:09.640 に答える
1

次の 3 つの問題があります。

  1. dt.style.left=500;する必要がありますds.style.left=500; (but see point #3)
  2. 要素を配置する必要があります#bgImg。元:position:relative;
  3. ほとんどのブラウザーは、500 ユニットが並んでいても問題ないはずですが、ds.style.left=500;よりdts.style.left='500px';良いでしょう。

jsFiddle の例

于 2012-09-25T21:01:31.197 に答える
0

css プロパティ "left" に "500px" などの値と測定値を設定する必要があります (px を忘れました)。

于 2012-09-25T20:55:05.117 に答える