我坚持使用模态：如何将文本放入其中

Total noob here.

总菜鸟在这里。

I am in the process of building my hobby website and feel that I could, with some hard work, create a fully functional site. However, I am rather stuck on modal popout window.

我正在构建我的业余爱好网站,并且觉得我可以通过一些努力创建一个功能齐全的网站。但是,我宁愿停留在模态弹出窗口。

I understand the basics of getting one to work, i.e. download jquery or related java library, attach said library to webpage in the section. Apply modal popout in similar way making sure to include the CSS for it.

我理解让一个人工作的基础知识,即下载jquery或相关的java库,将所述库附加到该部分的网页。以类似的方式应用模态弹出窗口,确保包含CSS。

I can get it to function in my site, so with Shadowbox I managed to get it to actually popout. Where I am stuck, with Shadowbox in particular, is actually putting stuff inside the modal popout. I am really only interesting putting text in the modal popout with maybe a link or small picture to compliment the text.

我可以让它在我的网站上运行,所以使用Shadowbox我设法让它实际弹出。我陷入困境的地方,尤其是Shadowbox,实际上是把东西放进模态弹出窗口。我真的很有趣的是将文本放在模态弹出窗口中,可能有链接或小图片来补充文本。

What is hindering me is my lack of knowledge. This may be either a lack of understanding with regards to class attributes or href attributes, or a lack of knowledge. The only progression I have made with this is simply because of the copy and paste, and some image path manipulation with Shadowbox. I am still horribly confused as to how the script activates, what tags/attributes I need to make to ensure data within a is included in the modal popout window.

阻碍我的是我缺乏知识。这可能是对类属性或href属性缺乏了解,或者缺乏知识。我用它做的唯一进展仅仅是因为复制和粘贴,以及使用Shadowbox的一些图像路径操作。关于脚本如何激活我仍然非常困惑,我需要做什么标记/属性来确保a中的数据包含在模态弹出窗口中。

I would really like to have a modal popout like this http://typedeskref.com/ but feel that this is far, far beyond me.

我真的希望有一个像这样的http://typedeskref.com/的模态弹出窗口,但我觉得这远远超出了我。

In summary: I don't know how to put text/images inside of a modal popout. I don't know how a modal popout is activated and how to ensure I can control what is kept inside of it. The reason why I say this is because the limited sucess I have had with Shadow box is because it has somehow managed to pick up everything that is on my site, images, links etc. So when the modal popout is opened, there is my site, in modal form.

总结:我不知道如何将文本/图像放在模态弹出窗口内。我不知道如何激活模态弹出窗口以及如何确保我可以控制其中保留的内容。我之所以这么说是因为我使用Shadow box有限的成功是因为它以某种方式设法拾取我网站上的所有内容,图片,链接等等。所以当打开模态弹出窗口时,有我的网站,以模态形式。

Thanks for taking the time to read this. I really appreciate any help or advice you can give me. Even a shove in the direction where such information can be located would be great!

感谢您抽时间阅读。非常感谢您给我的任何帮助或建议。即使是在可以找到这些信息的方向上推动也会很棒!

p.s. I am using dreamweaver cs5

附:我正在使用dreamweaver cs5

1 个解决方案

#1

Depends on how crazy and amazing you want your dialogs to be. It could be something as simple as downloading jQuery UI Dialogs (http://jqueryui.com/demos/dialog/) and then doing this.

取决于你想要对话的疯狂和惊人。它可能像下载jQuery UI Dialogs(http://jqueryui.com/demos/dialog/)然后执行此操作一样简单。

<div id="dialog">Hello</div>
<a id="button1">One</a>
<a id="button2">Two</a>

// Do the setup when the page has loaded
$(function() {

   // Create the dialog, don't show it on page load
   $("#dialog").dialog({autoOpen:false});

   // Button One will show the dialog
   $("#button1").click(function() { $("#dialog").dialog("open"); });

   // Button Two changes the content, THEN shows the dialog.
   $("#button2").click(function() { 
       $("#dialog").html("Goodbye");
       $("#dialog").dialog("open");
   });
});

It's a starting point. Same dialog, changing the content, triggered by clicking a link. That library has all manner of options (animations, etc) and you can style it to whatever look-and-feel you like.

这是一个起点。通过单击链接触发的同一对话框,更改内容。该库具有各种选项(动画等),您可以将其设置为您喜欢的任何外观。

Here is a demo: http://jsfiddle.net/dYMvH/

这是一个演示:http://jsfiddle.net/dYMvH/

#1