我制作了一个聊天机器人,现在我将其托管在本地服务器上。
我想将它嵌入到我的网站中,所以我真正想要的是像这个例子一样悬停在网站右下角的按钮/图标。
点击它时,它应该会在网站上弹出一个聊天机器人窗口。我应该如何进行此操作
最佳答案
基本上您将拥有两个东西,弹出窗口和触发器:
<div class="popup">
... Popup Stuff
</div>
<button>Click Me</button>
如果弹出窗口托管在您所在的页面之外,您可以在弹出窗口中使用 iframe 来呈现它:
<div class="popup">
<iframe src="http://wherever"/>
</div>
<button>Click Me</button>
你想让按钮切换弹窗的显示状态
const button = document.querySelector('button');
const popup = document.querySelector('.popup');
button.addEventListener('click', ()=>{
popup.style.display === 'none' ? popup.style.display = 'block' : popup.style.display = 'none';
})
关于html - 如何使用javascript在单击按钮/图标时弹出一个窗口,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54358890/