JavaScript onmouseover警报

这是我的代码，当我将鼠标悬停在图像上时，警告就会出现;JavaScript onmouseover警报

var special_offers = document.getElementsByClassName("special_offer"); 

//for each special offer 
for(i=0;i<special_offers.length;i++){ 
    var special_offer = special_offers[i]; 
    special_offer.setAttribute("offer_shown", "0"); 

    special_offer.onmouseover = function(){ 
     if(this.getAttribute("offer_shown") == "0"){ 
      this.setAttribute("offer_shown", "1"); 

      alert('This room has the special offer attached to it, please book soon before you miss out!'); 
     } 
    }

我想找出我如何从沼泽标准JS警报更改为一个盒子，我可以的风格，我想我会使用某种一个div的。

任何帮助，非常感谢。

来源

2013-04-22 Keith Burton

搜索模态窗口。 jQuery UI有一些你可以使用的。或者你可以用绝对定位的div制作你自己的。 – Paulpro 2013-04-22 00:43:39

对不起忘了添加我试图不使用jQuery – 2013-04-22 00:53:20

http://www.webdesignerdepot.com/2012/10/creating-a-modal-window-with-html5-and-css3/

这是创建自己的模式窗口一个很好的资源。您可以使用您的功能来激发您创建的模式窗口，而不是仅使用alert（）来启动标准警报。

来源

2013-04-22 00:46:32

这是否会用普通的HTML和CSS作为标题在网站上说HTML5和CSS3？ – 2013-04-22 00:55:56

我不这么认为。对不起 – 2013-04-22 04:12:52

你想把你的消息引导到一个div吗？

创建DIV

<div id="mySpecialOffer"> 
    Some Text gets updated 
</div>

在你的js，那么你可以针对这个ID和更新你想什么都消息。

document.getElementById("mySpecialOffer").innerHTML = 'some Text';

你甚至可以在CSS中隐藏div，然后用JS取消隐藏。

或者你可以创建HTML ...

document.getElementById("mySpecialOffer").innerHTML = '<div> Special Offer Div Inserted </div>';

这甚至使用jQuery容易。

这是你想到的吗？

来源

2013-04-22 00:59:48

不完全是，只有当我把鼠标悬停在特定的图像上时才会出现警告，但是我想通过JS只使用jQuery和HTML。因为我现在所拥有的是当我将鼠标悬停在图像上时，它显示出正常的警报框，我想用自己的警报框替换正常的警报框。这是我的网站目前的工作http://www.numyspace.co.uk/~unn_w12001251/accommodation.html – 2013-04-22 01:09:39

似乎你想要的是一个灯箱？哇，试图用直JS来做到这一点。无论如何，我不知道这样做，因为JS不创建HTML或CSS。你需要做的是创建一个函数来代替触发灯箱的警报消息。这是现代技术，您的用户会更喜欢它。这里有一个简单的解决方案的网站... http://www.emanueleferonato.com/2007/08/22/create-a-lightbox-effect-only-with-css-no-javascript-needed/ – 2013-04-22 01:42:38

作为我提到了添加document.getElementById（“mySpecialOffer）.innerHTML ='

...

';你可以添加所有你想要的html和样式，我会编写一个关闭按钮和另一个JS关闭新的div。您将需要添加CSS来设计新的div，使其看起来像是一个弹出窗口。以上链接就是一个很好的例子。让我知道这是否有助于你走上正轨。同样，不确定任何straigt JS方法，因为您需要动态添加HTML和使用CSS添加样式。 – 2013-04-22 01:49:14

你应该做的是打开一个全新的窗口，就像一个带有该消息的小网页。那将是最简单的方法！
这里是一个链接：http://www.w3schools.com/jsref/met_win_open.asp
当人们将鼠标悬停在图像上时，您将希望激活window.open（）。
您可以指定窗口的大小和位置，在这种情况下，屏幕的中心和一个小窗口。
希望有所帮助！

来源

2013-04-22 01:23:39 Shadowpat

不，我不想打开一个新窗口那不是我想要的。我有它现在我想要它，但我想我自己的警报框不是默认的。 – 2013-04-22 01:35:44

这实际上是最简单的解决方案。你想要的是一个灯箱，但是打开一个新窗口要复杂得多。 JS中没有任何东西会给出一个弹出窗口，您可以对Keith进行样式设置，除非您使用更加复杂的lightbox，然后使用弹出窗口。 – 2013-04-22 01:45:04

谢谢@ShawnAltman这就是我的意思，我不知道如何解释它！ – Shadowpat 2013-04-23 19:46:43

JavaScript onmouseover警报

回答

相关问题