Avatar billede daniel21 Nybegynder
03. september 2003 - 10:08 Der er 1 kommentar og
1 løsning

esc-knap, bruges til at gå "tilbage"

Jeg har en side der viser billeder i fuldskærm. Nu vil jeg gerne have at siden lukkes ned og går "tilbage" til den forrige side når man trykker på esc-knappen.

scriptet ser sådan her ud :

var alttext = "$label".replace(/\'/g, "'");
alttext = "'Click to start Slide Show from " + '"' + alttext + '"' + "'";
var imagefilepath = "<%=ifpath%>".replace(/\'/g, "%27");
var htmltext = '<A HREF="' + "<%=ifpath%>" + '" onclick="closeup(' + "'" + imagefilepath + "'" + ');return false" TITLE=' + alttext + '>';
htmltext += '<IMG CLASS="image" SRC="' + "$thumbPath" + '" WIDTH="$thumbWidth" HEIGHT="$thumbHeight" BORDER=0 Alt='
htmltext += alttext + ' TITLE=' + alttext + '></A>'
document.write(htmltext);

håber nogen kan hjælpe.

tak

Daniel
Avatar billede daniel21 Nybegynder
03. september 2003 - 10:10 #1
det var det forkerte script her er det rigtige : <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2 Final//EN">
<HTML>
<HEAD><META http-equiv="Page-Enter" CONTENT="progid:DXImageTransform.Microsoft.Fade(Duration=2)" />
<META HTTP-EQUIV="imagetoolbar" CONTENT="no">
<TITLE>$label</TITLE>
<LINK HREF="../$styleFile" REL=stylesheet>
<script language="JavaScript" type="text/javascript">
<!--<ja:if exists="nextPage">
var nextURL = "$nextPage";</ja:if><ja:else>
var nextURL = "$firstPage";</ja:else><ja:if exists="previousPage">
var prevURL = "$previousPage";</ja:if><ja:else>
var prevURL = "$lastPage";</ja:else>
var firstURL = "$firstPage";
var lastURL  = "$lastPage";
var timeout = 0;
var play_img = new Image();
play_img.src = "../gifs/play.gif";
var pause_img = new Image();
pause_img.src = "../gifs/pause.gif";

var delay = 5000;
var fullscreen = false;
if (window.opener && window.opener.document.forms.settings) {
    form = window.opener.document.forms.settings;
    delay = form.delay.value*1000;
    fullscreen = form.fullscreen.checked;
} else {
    var url = document.parentWindow.location.href;
    if (url.indexOf("?") > 0) {
        url = url.substr(url.indexOf("?") + 1);
        nextURL  += "?" + url;
        prevURL  += "?" + url;
        firstURL += "?" + url;
        lastURL  += "?" + url;

        url += "&";
        if (url.indexOf("delay=") >= 0) {
            var param = url.substr(url.indexOf("delay=") + 6);
            param = param.substr(0, param.indexOf("&"));
            delay = parseInt(param, 10) * 1000;
        }
        if (url.indexOf("fullscreen=") >= 0) {
            var param = url.substr(url.indexOf("fullscreen=") + 11);
            param = param.substr(0, param.indexOf("&"));
            fullscreen = (param.toUpperCase() == "YES");
        }
    }
}

function slide() {
    if (delay) {
        timeout = setTimeout(nextpage, delay);
    }
}

function nextpage() {
    if (timeout) {
        clearTimeout(timeout);
        timeout = 0;
    }
    document.location.href = nextURL;
}

function prevpage() {
    if (timeout) {
        clearTimeout(timeout);
        timeout = 0;
    }
    document.location.href = prevURL;
}

function firstpage() {
    if (timeout) {
        clearTimeout(timeout);
        timeout = 0;
    }
    document.location.href = firstURL;
}

function lastpage() {
    if (timeout) {
        clearTimeout(timeout);
        timeout = 0;
    }
    document.location.href = lastURL;
}

function playpause() {
    if (delay) {
        if (timeout) {
            clearTimeout(timeout);
            timeout = 0;
            document.images['playpause'].src = play_img.src;
        } else {
            document.images['playpause'].src = pause_img.src;
            nextpage();
        }
    } else {
        nextpage();
    }
}

function showindex() {
    if (timeout) {
        clearTimeout(timeout);
        timeout = 0;
    }

    if (window.opener) {
        window.close();
    } else {
<%
    String ifpath = "../" + indexPage;
    if (ifpath.indexOf("x.html") >= 0) ifpath = ifpath.substring(0, ifpath.indexOf("x.html")) + "x-frame.html";
%>
        document.parentWindow.location.href = "<%=ifpath%>";
    }
}

var avail;
function setVal() {
  // colCount = 5;
  // rowCount = 4;
  var win = new Array ("w","h");
  avail = new Array ("w","h");
  var obso = new Array ("w","h");
  // var imgSp = new Array ("w","h");
  var headSp = 65;                    // Space for the title and the controls, dependant on stylesheet
  var lablSp = 0;                    // Rowheight for the labels, dependant on stylesheet
  var footSp = 0;                    // Space for the jAlbum link and bottom margin
  var ixMarg = 10;                    // left and right margin value
  var scrollSp = 16;                // width or height of scrollbars - shouldn't really be needed  addSpH = 40;                      // Additional vertical space needed, probably due too browser dependent rendering
  var addSpH = 0;                    // Additional vertical space needed, probably due to browser dependent rendering
  var addSpW = 0;                    // Additional horizontal space needed, probably due to browser dependent rendering

  if (window.innerWidth) {
      win["w"] = window.innerWidth;
      win["h"] = window.innerHeight;
  } else if (document.body.clientWidth) {
      win["w"] = document.body.clientWidth;
      win["h"] = document.body.clientHeight;
  } else {
      win["w"] = screen.width;
      win["h"] = screen.height;
  }

  obso["w"] = (ixMarg * 2) + scrollSp + addSpW;
  obso["h"] = headSp + lablSp + footSp + scrollSp + addSpH;

  avail["w"] = win["w"] - obso["w"];
  avail["h"] = win["h"] - obso["h"];
}

var tWidth = 0;
var tHeight = 0;
function sizeImg(imgW, imgH)
{
  var imgRatio = imgW / imgH;

  function scaleWB() { tWidth = avail["w"]; tHeight = tWidth / imgRatio; }
  function scaleBW() { tHeight = avail["h"]; tWidth = tHeight * imgRatio; }

  if (imgRatio >= 1)        // determination of oriontation of image
  {
      scaleWB();
      if (tHeight > avail["h"]) { scaleBW(); }

  }
  else
  {
      scaleBW();
      if (tWidth > avail["w"]) { scaleWB(); }
  }
}

var btWidth = 0;
var btHeight = 0;
var imgbRatio = 1;
function sizeButtons(imgW, imgH)
{
    setVal();
    btWidth = imgW;
    btHeight = imgH;

    if (avail["w"] < 1200) {
        imgbRatio = avail["w"] / 1200;
        btWidth = Math.round(btWidth * imgbRatio);
        btHeight = Math.round(btHeight * imgbRatio);
    }
}

var takenAction = false;
function doKeyPress() {
    var oEvent = document.parentWindow.event;
    var myKeyCode = oEvent.keyCode;
    if (oEvent.repeat || takenAction) {
        return;
    }
    if (myKeyCode >= 16 && myKeyCode <= 18) {
        return;
    }
    if (oEvent.shiftKey) {
        myKeyCode += 1000;
    }
    if (oEvent.ctrlKey) {
        myKeyCode += 2000;
    }
    if (oEvent.altKey) {
        myKeyCode += 4000;
    }
    // alert(oEvent.type + "=" + myKeyCode);
    switch (myKeyCode) {
        case 13: // enter
        case 9:  // tab
        case 39: // right arrow
        case 40: // down arrow
        case 34: // page down
        case 107: // NumberPage +
        case 187: // keyboard +
        case 1187: // keyboard shift +
            takenAction = true;
            nextpage();
            break;
        case 8:  // backspace
        case 1009:  // shift tab
        case 37: // left arrow
        case 38: // up arrow
        case 33: // page up
        case 109: // NumberPage -
        case 189: // keyboard -
        case 1189: // keyboard shift -
            takenAction = true;
            prevpage();
            break;
        case 32: // space bar
            playpause();
            break;
        case 36: // Home
            takenAction = true;
            firstpage();
            break;
        case 35: // End
            takenAction = true;
            lastpage();
            break;
        case 27: // Escape
            takenAction = true;
            oEvent.returnValue = false;
            showindex();
            break;
        case 45: // Insert
            break;
        case 46: // Delete
            takenAction = true;
            showindex();
            break;
        default:
            // alert(oEvent.type + "=" + myKeyCode);
            break;
    }
}

var showing = false;
function toggleInfo() {
    if (showing == false) {
        if (timeout) {
            clearTimeout(timeout);
            timeout = 0;
            document.images['playpause'].src = play_img.src;
        }
        if (document.all || document.getElementById) {
            document.getElementById('imageinfo').style.visibility = "visible";    // IE & Gecko
        } else {
            document.layers['imageinfo'].visibility = "show"; // Netscape 4
        }
        showing = true;
    } else {
        if (document.all || document.getElementById) {
            document.getElementById('imageinfo').style.visibility = "hidden";    // IE & Gecko
        } else {
            document.layers['imageinfo'].visibility = "hide";    // Netscape 4
        }
        showing = false;
    }
}

function MM_reloadPage(init) {
    //reloads the window if Nav4 resized
    if (init==true) with (navigator) {
        if ((appName=="Netscape")&&(parseInt(appVersion)==4)) {
            document.MM_pgW = innerWidth;
            document.MM_pgH = innerHeight;
            onresize = MM_reloadPage;
        }
    } else if (innerWidth != document.MM_pgW || innerHeight != document.MM_pgH) {
        location.reload();
    }
}
MM_reloadPage(true);

window.focus();
// -->
</script>
</HEAD>
<BODY ID="slide" onload="slide()" marginwidth="0" marginheight="0" onkeydown="doKeyPress()" background="../gifs/bakgrund.jpg">
<div CLASS="imageinfo" ID="imageinfo" style="position:absolute; left:98px; top:123px; z-index:1; background-color: #000000; layer-background-color: #000000; width: 385px; height: 20px; visibility: hidden; border: 1px none #000000; background-image: url(../gifs/bakgrund.jpg); layer-background-image: url(../gifs/bakgrund.jpg)">
    <table width="100%" border="3" cellpadding="2" cellspacing="0" style="border-style:window-inset" onclick="toggleInfo()">
        <tr>
            <td>
                <table width="100%" border="0" cellpadding="1" cellspacing="1">
                    <tr class="rowFirst">
                        <td nowrap valign="top">Picture</td>
                        <td nowrap valign="top"><b>$label</b></td>
                    </tr>
                    <tr class="rowSecond">
                        <td nowrap valign="top">Format</td>
                        <td nowrap valign="top"><ja:if exists=formatName>$formatName</ja:if><!--<ja:if exists=compressionLevel> ($compressionLevel)</ja:if>--></td>
                    </tr>
                    <tr class="rowFirst">
                        <td nowrap valign="top">File size</td>
                        <td nowrap valign="top"><%=(float)((int)(fileSize/10000))/100;%>Mbytes</td>
                    </tr>
                    <tr class="rowSecond">
                        <td nowrap valign="top">Original date</td>
                        <td nowrap valign="top">$originalDate</td>
                    </tr>
                    <tr class="rowFirst">
                        <td nowrap valign="top">Resolution</td>
                        <td nowrap valign="top">$resolution</td>
                    </tr>
                    <tr class="rowSecond">
                        <td nowrap valign="top">Size @ 300dpi</td>
                        <td nowrap valign="top"><%=(int)(originalWidth/11.8);%>mm x <%=(int)(originalHeight/11.8);%>mm
                        <br>
                            <%=(float)((int)(originalWidth/3))/100;%>&quot; x <%=(float)((int)(originalHeight/3))/100;%>&quot;
                        <!--( Formateringstest:
                        <%=
                        import java.text.*;
                        NumberFormat fmt = NumberFormat.getInstance();
                        fmt.format(originalWidth/11.8);
                        %>
                        )-->
                        </td>
                    </tr>
                    <tr class="rowFirst">
                        <td nowrap valign="top">Artist</td>
                        <td nowrap valign="top"><ja:if exists="meta"><%= meta.get("Artist") %></ja:if><ja:else>&nbsp;</ja:else></td>
                    </tr>
                    <tr class="rowSecond">
                        <td nowrap valign="top">Photographer</td>
                        <td nowrap valign="top"><ja:if exists="meta"><%= meta.get("Copyright") %></ja:if><ja:else>&nbsp;</ja:else></td>
                    </tr>
                    <tr class="rowFirst">
                        <td nowrap valign="top">Film Scanner make</td>
                        <td nowrap valign="top">$cameraMake</td>
                    </tr>
                    <tr class="rowSecond">
                        <td nowrap valign="top">Scanner model</td>
                        <td nowrap valign="top">$cameraModel</td>
                    </tr>
                    <tr class="rowFirst">
                        <td nowrap valign="top">Firmware Version</td>
                        <td nowrap valign="top"><ja:if exists="meta"><%= meta.get("Software") %></ja:if><ja:else>&nbsp;</ja:else></td>
                    </tr>
                    <ja:if exists=originalPath>
                    <tr class="rowSecond">
                        <td nowrap valign="top">Download Original Image</td>
                        <td nowrap valign="middle" align="center"><a href="$originalPath" target="_blank" title="To download the picture. Right click and choose &quot;Save Target As...&quot;"><img src="../gifs/download.gif" border="0"></a></td>
                    </tr>
                    </ja:if>
                </table>
            </td>
        </tr>
    </table>
</div>

<!-- Previous, play/pause and close buttons -->
<!-- div id="navigation" -->
    <table cellpadding=0 cellspacing=0 border=0 align="center" width="90%">
        <tr>
            <td align="left">
                <ja:if exists="cameraMake">
                <A HREF="java script:toggleInfo()" ALT="Photographic information"><script language="JavaScript" type="text/javascript">
sizeButtons(142, 61);
document.write('<IMG SRC="../gifs/camera3.gif" WIDTH="' + btWidth + '" HEIGHT="' + btHeight + '" BORDER=0 ALT="Photographic information">');
</script></A></ja:if><ja:else>&nbsp;</ja:else>
            </td>
            <td align="center"><script language="JavaScript" type="text/javascript">
var htmltext = "&nbsp;";
if (!delay) {
htmltext = "$label".substr(0, 4);
htmltext += " - slide $imageNum of $totalImages";
}
document.write(htmltext);
</script></td>
            <td align="right">
                <table border=0>
                    <tr>
                        <td>
                            <!-- Previous button -->
                            <a href="java script:prevpage()" ALT="Previous page"><script language="JavaScript" type="text/javascript">
document.write('<IMG SRC="../gifs/previous.gif" WIDTH="' + btWidth + '" HEIGHT="' + btHeight + '" BORDER=0 ALT="Previous page">');
</script></A>
                        </td>
                        <td>
                            <!-- Play/Pause button -->
                            <a href="java script:playpause()"><script language="JavaScript" type="text/javascript">
if (delay) {
    var nextimg = "../gifs/pause.gif";
    var nexttxt = "Toggle Slideshow";
} else {
    var nextimg = "../gifs/next.gif";
    var nexttxt = "Next Slide";
}
document.write('<IMG SRC="' + nextimg + '" name="playpause" WIDTH="' + btWidth + '" HEIGHT="' + btHeight + '" BORDER=0 ALT="' + nexttxt + '">');
</script></A>
                        </td>
                        <td>
                            <!-- Close button -->
                            <a href="java script:showindex()"><script language="JavaScript" type="text/javascript">
document.write('<IMG SRC="../gifs/index.gif" WIDTH="' + btWidth + '" HEIGHT="' + btHeight + '" BORDER=0 ALT="Return to Index">');
</script></A>
                        </td>
                    </tr>
                </table>
            </td>
        </tr>
    </table>
<!-- /div -->
<!-- Image with link to next OR original path -->
<table align="center" cellspacing=0 cellpadding=0 border=0 width="98%">
    <tr>
        <td align="center" valign="top" style="vertical-align:top">
            <ja:if exists=originalPath>
            <A HREF="$originalPath"><script type="text/javascript">
setVal();
sizeImg($imageWidth, $imageHeight);
document.write('<IMG SRC="' + "$imagePath" + '" WIDTH="' + tWidth + '" HEIGHT="' + tHeight + '" BORDER=0 ALT="Click to view Original Image">');
</script></a>
            </ja:if><ja:else>
            <A HREF="java script:nextpage()"><script type="text/javascript">
setVal();
sizeImg($imageWidth, $imageHeight);
document.write('<IMG SRC="' + "$imagePath" + '" WIDTH="' + tWidth + '" HEIGHT="' + tHeight + '" BORDER=0 ALT="Click to show Next Page">');
</script></a>
            </ja:else>
        </td>
    </tr>
</table>
<!-- Always display comment over image (if exists) -->
<ja:if exists="comment">
<div id="comment_shadow">$comment</div>
<div id="comment">$comment</div>
</ja:if>
</BODY>
</HTML>
Avatar billede daniel21 Nybegynder
03. september 2003 - 10:27 #2
case 27
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Kurser inden for grundlæggende programmering

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester