文章/答案/技术大牛

发布

社区首页 >问答首页 >处理4k图片的horizontalHandle

问处理4k图片的horizontalHandle
EN

Stack Overflow用户

提问于 2015-10-03 11:25:40

回答 1查看 39关注 0票数 0

我可以试着制作一张用于4k图片的图片，我想当我拖动手柄(见链接)在图片上时，它会从FuLL HD变为4k或4k到全高清，但它不会移动，我也不知道为什么！使用句柄horizontalHandle正确吗？？这是我的代码和示例站点，我希望我的图像像这样，谢谢任何帮助

<!DOCTYPE html>

<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8" />
    <title></title>
</head>
<body>
    <div style="box-sizing: border-box; color: #333; font-size: 100%; font-weight: normal; line-height: 100%; margin: 0; padding: 0;">
    <div style="background: rgba(0, 0, 0, 0) url(http://panasonic.net/prodisplays/solutions/technology/4K/img/whats_bg01.jpg) repeat scroll 0 0; padding: 50px 0;">
        <div style="margin: 0 auto; position: relative; width: 967px;">
            <div style="overflow: hidden; position: relative; width: 967px; height: 544px;">
                <div style="overflow: hidden; position: absolute; width: 483.5px; height: 544px; z-index: 2;">
                    <img width="967" height="544" alt="" src="http://panasonic.net/prodisplays/solutions/technology/4K/img/whats_img03.jpg" />
                </div>
                <div style="overflow: hidden; position: absolute; z-index: 1;">
                    <img width="967" height="544" alt="" src="http://panasonic.net/prodisplays/solutions/technology/4K/img/whats_img04.jpg" />
                </div>
                <p></p>
                <div style="height: 100%; width: 1px; position: absolute; z-index: 3; left: 482.5px; top: 0px; cursor: ew-resize;">
                    <span style="background-image: url(http://panasonic.net/prodisplays/solutions/technology/4K/img/whats_bar.png); background-repeat: no-repeat; position: absolute; background-position: 0 0; height: 544px; overflow: hidden; width: 55px; left: -27px; top: 0px;"></span>
                </div>
            </div>
        </div>
        <p class="att">Drag your mouse to move from Full-HD to 4K</p>
        <p>
            High-volume data is also sharp and crisp.
                <br />
            Images are displayed on a single screen, so the data is not split up and viewers can concentrate on the screen image.
        </p>
    </div>
</div>
</body>
</html>

http://panasonic.net/prodisplays/solutions/technology/4K/index.html

javascript

html

css

twitter-bootstrap

回答 1

Stack Overflow用户

回答已采纳

发布于 2015-10-03 12:43:24

您可以在这里使用TwentyTwenty，http://zurb.com/playground/twentytwenty

关于GitHub：https://github.com/zurb/twentytwenty

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/32921985

复制

相似问题

问处理4k图片的horizontalHandle
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问处理4k图片的horizontalHandleEN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问处理4k图片的horizontalHandle
EN