如何使用 javascript 移动图像元素以及如何使其保持在那里
使用 javascript 我想单击一个链接,然后让 javascript 将图像元素移动到某个位置。我面临的唯一问题是图像元素不会停留在那里,为什么
示例 javascript: css 会移动到上面。
function move( e )
{
var clickedLink = e.target;
// getting location of clicked link.
clickedLink.style.left = "200px";
clickedLink.style.top = "200px";
}
函数中“clickedLink”元素对象的
#clickedLink
{
left: 0px;
position: relative;
top: -500px;
z-index: 10;
}
using javascript i want to click on a link, and then have javascript move an image element to some location. Only problem im facing is that the image element won't stay there, why is that
sample javascript:
function move( e )
{
var clickedLink = e.target;
// getting location of clicked link.
clickedLink.style.left = "200px";
clickedLink.style.top = "200px";
}
css for the "clickedLink" element object in the function move above.
#clickedLink
{
left: 0px;
position: relative;
top: -500px;
z-index: 10;
}
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(4)
目标没有样式选项只需更改为 e。
Target don't have a style option just change into e.
当您说它不会“留在那里”时,您并不是试图让它在页面刷新后留在那里而不将其新位置保存在某处,是吗?
更新:
要存储位置,取决于存储它的原因。您可以按照其他人的建议将其存储在 cookie 中,但这只会在该浏览器中为该用户保存它,并且只会在他们清除 cookie 之前保存。
如果您想要进行的更改在不同的浏览器中保留给用户,或者使其可供其他用户使用...那么您需要通过 Ajax 将更改保存到服务器,并且您必须拥有服务器- 位置设置等中的侧代码加载
When you say it won't "stay there", you aren't trying to get it to stay there after the page refreshes w/o saving it's new location somewhere, are you?
UPDATE:
To store the location, it depends on why you're storing it. You can store it in a cookie as others have suggested, but that will only save it for that one user, in that one browser, and only until they clear the cookies.
If you want to make a change that stays w/ the user across different browsers, or make it available to other users... then you'll need to persist the change to a server via Ajax and you'll have to have the server-side code load in the location settings, etc.
使用 Javascript 所做的更改不会在页面重新加载后持续存在。
必须使用 CSS 进行永久性更改,否则每次加载页面时都必须使用 Javascript 重新移动该元素。
例如,您可以将客户端的首选项保存在 cookie 中,然后使用 window.onload 事件来触发检查 cookie 的函数,并相应地更新元素。
或者,您可以使用服务器端脚本生成一个额外的 CSS 文件,该文件可在当前用户保存时进行定制,以适应当前用户的首选项(假设是同一用户)。然后,在加载页面时检查该文件是否存在(再次使用服务器端脚本)。
要点是,Javascript 更改只是暂时的,因为它们仅在客户端浏览器上发生一次。
The changes made using Javascript will not persist over a page reload.
A permanent change must be made using the CSS, otherwise the element must be re-moved using Javascript every time the page is loaded.
You could save the client's preferences in a cookie, for example, then use the
window.onload
event to fire a function that checks the cookie, and updates the element accordingly.Or, you could use a server-side script that generates an extra CSS file customized to fit the current user's preferences (assuming it's the same user) when they save. Then, check for this file's existence when the page is loaded (again with server-side script).
The main point is, Javascript changes are only temporary since they happen one time on the client's browser.
如果您希望它在页面刷新后保留在原位,则需要将其位置存储在 cookie 中,并在页面加载时加载它。
if you want it to persist in place after the page has refreshed, you'll need to store its location in a cookie and load it when the page loads.