combine two javascripts

**acefilleddreams** · 01-19-2013, 02:19 AM

I found two jave scripts that I wanted to use for my webpage.

The first simply brings a message box if a user right clicks in an effort to protect copyrighted images.

The Second brings up an html window to display a larger version of the image.

First Code:

Code:

<script type="text/javascript">
//<![CDATA[

    function nocontext(e) {
        var clickedTag = (e==null) ? event.srcElement.tagName : e.target.tagName;
        if (clickedTag == "IMG") {
            alert(alertMsg);
            return false;
        }
    }
    var alertMsg = "Images and the products represented on this site are protected by copyright laws.";
    document.oncontextmenu = nocontext;
//]]>
</script>

Second Code:

Code:

<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="black" //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 : 2
toppos=(detectexist(window.screenTop))? screenTop+document.body.clientHeight/2-popheight/2 : detectexist(window.screenY)? screenY+innerHeight/2-popheight/2 : 2
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"></body></html>')
jkpopwin.document.close()
jkpopwin.focus()
}

</script>

**vwphillips** · 01-19-2013, 06:48 AM

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>
  <title></title>
<script type="text/javascript">
//<![CDATA[

    function nocontext(e) {
        var clickedTag = (e==null) ? event.srcElement.tagName : e.target.tagName;
        if (clickedTag == "IMG") {
            alert(alertMsg);
            return false;
        }
    }
    var alertMsg = "Images and the products represented on this site are protected by copyright laws.";
    document.oncontextmenu = nocontext;

function PopUp(mid,pid,src,w,h,txt){
 var msk=document.getElementById(mid),pop=document.getElementById(pid);
 if (msk&&pop){
  var img=pop.getElementsByTagName('IMG')[0],div=pop.getElementsByTagName('DIV')[0];
  if (src){
   img.src=src;
   div.innerHTML=txt||'';
   pop.style.width=w+'px';
   pop.style.height=h+'px';
   pop.style.width=img.width+'px';
   pop.style.height=div.offsetTop+div.offsetHeight+'px';
  }
  pop.style.left=(msk.offsetWidth-pop.offsetWidth)/2+'px'
  pop.style.top=(msk.offsetHeight-pop.offsetHeight)/2+'px'
  pop.style.visibility=msk.style.visibility=src?'visible':'hidden';
 }
}



//]]>
</script>


 <style type="text/css">
/*<![CDATA[*/

#mask { /* CSS for the background mask */
 position:fixed;z-Index:101;visibility:hidden;width:100%;height:100%;left:0px;top:0px;background-Color:#FFCC66;cursor:pointer;
/* Moz */
  opacity: .5;
/* IE5-7 */
  filter: alpha(opacity=50);
/* IE8 */
   -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
}

#popup {
  position:fixed;
  visibility:hidden;
  z-Index:111;
  padding:10px;
  text-Align:center;
  background-Color:#FFCC66;
}


/*]]>*/
</style>

</head>

<body>
<img src="http://www.vicsjavascripts.org.uk/StdImages/Egypt12.jpg" onmouseup="PopUp('mask','popup','http://www.vicsjavascripts.org.uk/StdImages/WinterPalace.jpg', 300, 300, 'textdescription');"/>

<div id="mask" title="Click to Close" onmouseup="PopUp('mask','popup',false);" ></div>
<div id="popup" title="Click to Close" onmouseup="PopUp('mask','popup',false);" >
<img src="http://www.vicsjavascripts.org.uk/StdImages/Egypt12.jpg" />
<div></div>
</div>

</body>

</html>

also see

http://www.vicsjavascripts.org.uk/Ma...agicViewer.htm