[HTML - Javascript] Intro horizontaal en vertikaal centreren - Softwareontwikkeling

maandag 18 oktober 2004 21:00

Acties:

Topicstarter

Ik heb mn intro gemaakt en heb het volgende:

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">
<head>
<title>intro_imageready2</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<!-- ImageReady Preload Script (intro_imageready2.psd) -->
<script type="text/javascript">
<!--

function newImage(arg) {
    if (document.images) {
        rslt = new Image();
        rslt.src = arg;
        return rslt;
    }
}

function changeImages() {
    if (document.images && (preloadFlag == true)) {
        for (var i=0; i<changeImages.arguments.length; i+=2) {
            document[changeImages.arguments[i]].src = changeImages.arguments[i+1];
        }
    }
}

var preloadFlag = false;
function preloadImages() {
    if (document.images) {
        intro_02_over = newImage("images/intro_02-over.jpg");
        intro_05_over = newImage("images/intro_05-over.jpg");
        intro_07_over = newImage("images/intro_07-over.jpg");
        intro_08_over = newImage("images/intro_08-over.jpg");
        preloadFlag = true;
    }
}

// -->
</script>
<!-- End Preload Script -->

<!-- Align Hor & Vert -->
<script language="JavaScript" type="text/JavaScript">
<!--
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);
//-->
</script>
<!-- End Align Hor & Vert -->

</head>
<body bgcolor="#292929" onload="preloadImages();">
<!-- ImageReady Slices (intro_imageready2.psd) -->
<div align="center">
<table id="Table_01" width="682" border="0" cellpadding="0" cellspacing="0">
    <tr>
        <td colspan="3">
            [img]"images/intro_01.jpg"[/img]</td>
        <td rowspan="2">
            <a href="#"
                onmouseover="changeImages('intro_02', 'images/intro_02-over.jpg'); return true;"
                onmouseout="changeImages('intro_02', 'images/intro_02.jpg'); return true;"
                onmousedown="changeImages('intro_02', 'images/intro_02-over.jpg'); return true;"
                onmouseup="changeImages('intro_02', 'images/intro_02-over.jpg'); return true;">
                [img]"images/intro_02.jpg"[/img]</a></td>
        <td rowspan="4">
            [img]"images/intro_03.jpg"[/img]</td>
        <td>
            [img]"images/spacer.gif"[/img]</td>
    </tr>
    <tr>
        <td rowspan="3">
            [img]"images/intro_04.jpg"[/img]</td>
        <td rowspan="2">
            <a href="#"
                onmouseover="changeImages('intro_05', 'images/intro_05-over.jpg'); return true;"
                onmouseout="changeImages('intro_05', 'images/intro_05.jpg'); return true;"
                onmousedown="changeImages('intro_05', 'images/intro_05-over.jpg'); return true;"
                onmouseup="changeImages('intro_05', 'images/intro_05-over.jpg'); return true;">
                [img]"images/intro_05.jpg"[/img]</a></td>
        <td rowspan="3">
            [img]"images/intro_06.jpg"[/img]</td>
        <td>
            [img]"images/spacer.gif"[/img]</td>
    </tr>
    <tr>
        <td rowspan="2">
            <a href="#"
                onmouseover="changeImages('intro_07', 'images/intro_07-over.jpg'); return true;"
                onmouseout="changeImages('intro_07', 'images/intro_07.jpg'); return true;"
                onmousedown="changeImages('intro_07', 'images/intro_07-over.jpg'); return true;"
                onmouseup="changeImages('intro_07', 'images/intro_07-over.jpg'); return true;">
                [img]"images/intro_07.jpg"[/img]</a></td>
        <td>
            [img]"images/spacer.gif"[/img]</td>
    </tr>
    <tr>
        <td align="center" valign="middle">
            <a href="#"
                onmouseover="changeImages('intro_08', 'images/intro_08-over.jpg'); return true;"
                onmouseout="changeImages('intro_08', 'images/intro_08.jpg'); return true;"
                onmousedown="changeImages('intro_08', 'images/intro_08-over.jpg'); return true;"
                onmouseup="changeImages('intro_08', 'images/intro_08-over.jpg'); return true;">
                [img]"images/intro_08.jpg"[/img]</a></td>
        <td>
            [img]"images/spacer.gif"[/img]</td>
    </tr>
</table>
<div>
<!-- End ImageReady Slices -->
</body>
</html>

Dit geeft het volgende weer:

Afbeeldingslocatie: http://img46.exs.cx/img46/7619/intro1.th.jpg

Maar vertikaal wil hij het niet doen, nogthans heb ik dit scriptje in mn code verwerkt:

code:

<!-- Align Hor & Vert -->
<script language="JavaScript" type="text/JavaScript">
<!--
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);
//-->
</script>
<!-- End Align Hor & Vert -->

Wat doe ik verkeerd??

Partners: AV-Solutio | Mutrox | B&W | Trinnov

maandag 18 oktober 2004 21:01

Acties: