jquery - 如何使用旋转 css 以及 jQuery 可拖动 ASP.NET

Question

我有一个 div 标签，它有:

id="ipad" style="background-image: url(images/large-ipad.png); -ms-transform: rotate(90deg);
        background-repeat: no-repeat; width: 511px; height: 356px; padding: 41px 67px 41px 67px;
        margin: auto;"

在div里面有一个span标签

id="lbl1" style="-ms-transform:rotate(90deg)">

和跨度标签之间的一些文本

和它的javascript:

$(document).ready(function () {          
        $('#lbl1').draggable({
            containment: 'parent',
            scroll: false               
        });
    });

基本上我想要做的是我有一个 div 标签，它在背景中有 ipad 图像。现在我有两个选项来旋转 div 标签 1.lanscape 和 2.portrait。我通过将 css:-ms-transform:rotate(90deg) 应用到 div 标签来实现 div 标签的旋转，但是旋转后发生的事情是 draggable 无法正常工作，它被拖到父级之外并且甚至文本旋转也不起作用。

你能帮我解决这个问题吗？基本上我希望可拖动文本与 div 旋转一起旋转并且可拖动应该正常工作。

Answer 1

基本上事情不会像这样，

您需要定义范围广泛的尺寸，因为用户会浏览您的应用程序你必须使用新的 css 媒体查询

@media screen and (min-device-width: 480px) { your css for this query goes here }
@media orientation (landscape or portrait){ ... }