使用ajax将页面显示为浮动div

Question

我需要在我的页面上做下面的按钮：

单击该按钮将产生一个div，该div漂浮在页面上方，并加载到另一个内部页面中。

这应该用Ajax来完成，对吗？我对ajax一无所知，所以我不知道如何继续。

这就是我现在拥有的：

<div id="clickmebutton" onclick="javascript:FloatingPage();">Click me</div>

<script type="text/javascript">
function FloatingPage() {
   new Ajax.Request('/floatingpage.php' {
        onSuccess: function(response) {
            document.getElementById('main').style.display = 'block';
            document.getElementById('subcontent').innerHTML = response.responseText;

        } 
   });
}
</script>

作为css

#layer subcontent {background-color: aqua; width:100px; height: 100px; margin:8px; display: none;}

编辑:我想要做的是在我的表单中做一个图像选择器。div将在服务器上显示图像，并将其列在数据库中，作为一个<选项>。然后，我可以选择要在表单中使用的图像，获取id并在我的表单中发送id。

使用来自jquery的()函数的解决方案得到了我想要的。

Answer 1

我使用fancybox在我的网站上显示网页和媒体。它使用JQuery，实现简单。您可以在这里找到更多的信息和说明，http://fancybox.net/

你可以显示任何东西，从内部网页到Youtube视频和谷歌地图。

我建议使用JQuery来实现浮动div，而不是Ajax，因为它很容易组合在一起，并且不需要以前的专业知识。