如何弹出图像和链接与javascript或jQuery

How to popUp image and link with javascript or jQuery?

本文关键字:javascript jQuery 链接 何弹出 图像      更新时间:2023-09-26

如果你知道如何做这样的事情,我的意思是如何加载一个javascript或jQuery弹出图像onLoad(一次),我怎么能把它链接到其他地方,请帮助我=(

)

http://lokeshdhakar.com/projects/lightbox2/

window.onload= function(){
var myEvt = document.createEvent('MouseEvents');
myEvt.initEvent(
   'click'      // event type
   ,true      // can bubble?
   ,true      // cancelable?
);
document.getElementById('myLink').dispatchEvent(myEvt);
}

这是一个关于如何创建模态容器的教程
http://www.queness.com/post/77/simple-jquery-modal-window-tutorial
一旦你有了它,你就可以触发

里面的模态窗口
$(document).ready(function(){
// trigger modal here
});

看起来div只是在页面加载时设置为可见。

<div id="lightBox" style="width:100%; height:100%; position:absolute; z-index:1100; background:url(images/bgfb.png);display:block">
        <div  id="ekranKapla" style="position: absolute; top: 50%; left: 50%; margin-left:-255px; margin-top:-196px;display:block">
            <img src="/images/lightbox.png" border="" alt="facebook" useMap="#mapThis" />    
        </div>
</div>  
<map name="mapThis" id="mapThis">
<area shape="rect" coords="470,2,509,37"  onclick="javascript:lightBoxKapat();" href="#" />
<area shape="rect" coords="293,294,496,370" href="http://www.facebook.com/EczacibasiToplulugu" target="_blank" title="facebook " />
</map>
<script type="text/javascript">
function lightBoxKapat() {
    document.getElementById("lightBox").style.display = "none";
    document.getElementById("ekranKapla").style.display = "none";
}
</script>

然后用户可以点击它来隐藏它

不要使用JavaScript——至少不要显示它。要在页面加载时显示图片,只需按这种方式编写HTML代码。

要显示或隐藏它,只需使用:

$("#popupContainer").show();
$("#popupContainer").hide();

工作演示: http://jsfiddle.net/7rVaZ/