:( or :-( 
:p or :-p 
:D or :-D 
:$ or :-$
;) or ;-)
ppdéis ver cómo funciona en la sidebar izquierda-al final-, picando donde dice "con pala y todo": saldrá una ventana con un muñeco dentro.
Y se hace así:
1º.- Insertar ésto dentro de la tag head de la plantilla (yo lo he puesto en un Elemento de página HTML-jAVA):
<script type="text/javascript">
// JK Pop up image viewer script- By JavaScriptKit.com
// Visit JavaScript Kit (http://javascriptkit.com)
// for free JavaScript tutorials and scripts
// This notice must stay intact for use
var popbackground="lightskyblue" //specify backcolor or background image for pop window
var windowtitle="Image Window" //pop window title
function detectexist(obj){
return (typeof obj !="undefined")
}
function jkpopimage(imgpath, popwidth, popheight, textdescription){
function getpos(){
leftpos=(detectexist(window.screenLeft))? screenLeft+document.body.clientWidth/2-popwidth/2 : detectexist(window.screenX)? screenX+innerWidth/2-popwidth/2 : 0
toppos=(detectexist(window.screenTop))? screenTop+document.body.clientHeight/2-popheight/2 : detectexist(window.screenY)? screenY+innerHeight/2-popheight/2 : 0
if (window.opera){
leftpos-=screenLeft
toppos-=screenTop
}
}
getpos()
var winattributes='width='+popwidth+',height='+popheight+',resizable=yes,left='+leftpos+',top='+toppos
var bodyattribute=(popbackground.indexOf(".")!=-1)? 'background="'+popbackground+'"' : 'bgcolor="'+popbackground+'"'
if (typeof jkpopwin=="undefined" || jkpopwin.closed)
jkpopwin=window.open("","",winattributes)
else{
//getpos() //uncomment these 2 lines if you wish subsequent popups to be centered too
//jkpopwin.moveTo(leftpos, toppos)
jkpopwin.resizeTo(popwidth, popheight+30)
}
jkpopwin.document.open()
jkpopwin.document.write('<html><title>'+windowtitle+'</title><body '+bodyattribute+'><img src="'+imgpath+'" style="margin-bottom: 0.5em"><br>'+textdescription+'</body></html>')
jkpopwin.document.close()
jkpopwin.focus()
}
</script>
2º.- Y ésto dentro de la tag Body, donde queráis que aparezca la imagen en su ventana (que yo he puesto, a continuacíon del código anterior, en el Elemento de página):
<a href="#" onClick="jkpopimage('food1.jpg', 325, 445, 'Breakfast is served.'); return false">
Breakfast pancakes</a>
Insertad aquí la URL de la imagen y cambiad el texto de la imagen y el del link a vuestro gusto.
Vía: JavascriptKit
Nota: los números que van detrás de la URL (en el ej. "food1.jpg"), son el ancho y el alto, respectivamente, de la ventana pop-up: cambiadlos a vuestra conveniencia.
|Sin comentarios
Dejar un Comentario