gpt4 book ai didi

javascript - 在 jquery 中旋转图像时需要概念?

转载 作者:太空宇宙 更新时间:2023-11-03 18:36:04 24 4
gpt4 key购买 nike

我正在使用 jquery 一次实现一个旋转。我有一些图像,我想使用“touchmove”、“swipeleft”或“swiperight”一次旋转一个。

首先,我制作了一个可以放置所有图像的背景。我的问题是我能否在开始时给出一个静态值(左上角)并在 swipeleft 和 swiperight 事件上更改顶部和左侧的值。

这是我想要实现的: Screenshot of browser with circular pane

我的代码:

<body>

<div class="outer-container">


</div>
</body>

.outer-container{
background-image: url(images/dial.png);
width: 400px;
height: 403px;
background-size: cover;
top: 280px;
left: 32%;
position: absolute;
}

这是现在的样子:

Screenshot of browser with circular pane without buttons

最佳答案

添加新图片:只需放一堆这些:<img src="--path--" style="position:absolute;top:--value--;left:--value--;" id="--uniqueID--"></img>并将 --path-- 替换为图像的路径,并将 --value-- 替换为适当的位置。还要将 --uniqueID-- 替换为唯一 ID(两张图片不应具有相同的 ID)。

我不完全确定你在问什么,但你可以在你的页面中包含一个样式表来设置初始 topleft值,然后使用 jQuery 的 .css() 动态更改这些值。

$('.outer-container').on('swipeleft',function(e){
e.preventDefault();
$('#--uniqueID--').css("left",newLeftValue);
$('#--uniqueID--').css("top",newTopValue);
});

将 --uniqueID-- 替换为您要移动的图片。

用适当的值替换 newLeftValue 和 newTopValue。

参见 http://api.jquery.com/css/有关 jQuery 的 css 方法的更多信息。

关于javascript - 在 jquery 中旋转图像时需要概念?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18632758/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com