php - 使用循环从多个 PHP 回显属性设置 CSS x 和 y

标签 php jquery mysql css user-interface

专家的一个快速问题,

我正在制作一个协作网站,让用户可以添加带有文本的便签并在屏幕上移动它们。我有一个数据库文件存储文本和坐标 (PHP/MySql) 通过 ajax 和 jquery/jquery UI 完成。我在从数据库中获取数据并返回到页面时遇到了一些问题。

数据被循环到一个 div 类中(以 x 和 y 作为属性),我正在使用一个循环来取回 x 和 y 并尝试将它们应用到 CSS。我已经发出警报并且正在获取数据,但我似乎在应用它时遇到了问题。我知道这个元素会很顺利....谢谢你的时间。

这是我正在尝试的代码:

基本的 PHP 循环:

<?php

$get_textsticky_query = "SELECT * FROM textsticky 
                        WHERE user_id = $current_id 
                       AND project_id=$user_project_id";

$get_textsticky_result=mysql_query($get_textsticky_query);
while($row=mysql_fetch_assoc($get_textsticky_result)){

echo '<div class="textsticky" x="'.$row['textsticky_x'].'" y="'.$row['textsticky_y'].'"><div class="textstickyvalueholder" contentEditable="true" textstickyid="'. $row['textsticky_id'] .'">'. $row['textsticky_text'] .'</div><button>Like</button></div>';
}

?>

尝试使用 jquery 应用于 CSS:

 $(".textsticky").each(function(index){

 //store x, y from looped php
 var x = $(this).attr("x");
 var y = $(this).attr("y");

 //assign looped php to css
 $(this).css("left",x);
 $(this).css("top",y);

  });

最佳答案

要在父容器内移动对象,您需要在 .textsticky 的 css 中设置 postoon: relative;

要在整个屏幕上移动对象,您需要设置position: absolute;

如果不更改 position 属性,lefttop 值将不执行任何操作。

关于php - 使用循环从多个 PHP 回显属性设置 CSS x 和 y,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/8974451/

相关文章:

php - 将键/值对与 Laravel 模型关系隔离

php - Laravel 查询变量作为字符串

php - 工作时间跨越午夜

php - 从日期时间计算加类时间

mysql - 错误 1242 - 子查询返回多于 1 行

javascript - jQuery 建表

javascript - 无法对不在 DOM 中的 Metamorph 执行操作

javascript - 如何验证Spring表单:form's form:password with JQuery Validation?

jquery - MySQL 中遍历行并删除一些数据的代码是什么?

php - Laravel 是如何管理 MySQL 变量的?