Avatar billede krk Nybegynder
05. april 2005 - 10:08 Der er 11 kommentarer og
1 løsning

Swop billeder - javascript i php

Hej.
Er der nogen der kan få dette til at virke!!!

Jeg er ved at lave et "galleri", hvor når jeg køre musen over et billede skifter et større billede i en anden celle (se evt. http://kryt.dk/kasser/webdesign.htm . Der har jeg tidligere fået det til at virke)
Men nu hvor jeg trækker data ind fra en database kan jeg ikke få det til at virke med mouseoveren.
Er der nogen der kan se hvad jeg har gjort forkert - jeg har simpelhen stiret mig blind på siden.

Jeg er også i tvivl om jeg har placeret mit javaScript det rigtige sted.

Min side er bygget op med en index.php hvor jeg trækker galleri.php ind.

Jeg sender lige koden med:
Index.php:
<html>
<head>
<title>Kat</title>
</head>
<body>
<?php

require("req/db_connect.php");

$page = $_REQUEST['page'];
       
        if(!$page){
            require("content/galleri.php");
        }else{
            require("content/$page.php");
        }

?>
</body>
</html>

galleri.php:
<script type="text/javascript">
var activeImg;
function swapImages(ID) {
      elm = document.getElementById(ID).style
      if (activeImg) {activeImg.display="none";}
      elm.display = (elm.display == "block") ? "none" : "block";
      activeImg = elm;
}
function initImg() {
      activeImg = document.getElementById("pic1").style;
      activeImg.display = "block";
}
window.onload=initImg;
</script>

<?php
$pageparm = $_REQUEST['pageparm'];

$offset         = 0;
$rowCount1         = 7;
$rowCount2         = 5;
$rowCount3         = 5;
$rowPrPage        = $rowCount1+$rowCount2+$rowCount3;
$page            = $pageparm;
$imgCounter        = ($page+1)*$rowPrPage;

//Henter counter.php som tæller hvor mange rækker der er i tabellen i databasen
require("counter.php");

//Henter de første 7 billeder i tabellen
$offset = $page* $rowPrPage;
$query        ="SELECT * FROM katte_galleri ORDER BY id LIMIT $offset,$rowCount1;";
$result    = mysql_db_query ($database, $query, $link );


print"<table width='700' border='0' cellspacing='0' cellpadding='0'>
  <tr valign='top'> ";
    while($row = mysql_fetch_array($result)){
        $id                = $row[id];
        $billede        = $row[billede];
        $tekstindhold     = $row[tekstindhold];
        $imgaestor         = $row[imgaestor];
        print"<td width='100'><a href='http://kryt.dk/gade'><img src ='content/upload/$billede' width='90' height='70' border='0' onmouseover='swapImages('pic$id')' onmouseout='swapImages('pic$id')'  ></a> </td>\n";
       
       
    }       
   
print"</tr><tr valign='top'><td width='100'>";
   

//Henter de næste 5 billeder fra tabellen
$offset =$offset+$rowCount1;   
$query        ="SELECT * FROM katte_galleri ORDER BY id LIMIT $offset,$rowCount2;";
$result    = mysql_db_query ($database, $query, $link );

    print"<table width='100' border='0' cellspacing='0' cellpadding='0'>";
    while($row = mysql_fetch_array($result)){
        $id                = $row[id];
        $billede        = $row[billede];
        $tekstindhold     = $row[tekstindhold];
        $imgaestor         = $row[imgaestor];
        print"<tr><td><a href='http://kryt.dk/gade'><img src ='content/upload/$billede' width='90' height='70' border='0' onmouseover='swapImages('pic$id')' onmouseout='swapImages('pic$id')'  ></a> </td>
               
            </tr>";
    }   
   
print"</table></td><td colspan='5' rowspan='5'>";




//Henter de store billeder der skal skifte ved mouseover
$query        ="SELECT * FROM katte_galleri ORDER BY id ;";
$result    = mysql_db_query ($database, $query, $link );

print"<table><tr><td><img id='pic$id' src='content/upload/en.jpg' style='display:block'>\n";
    while($row = mysql_fetch_array($result)){
        $id                = $row[id];
        $billede        = $row[billede];
        $tekstindhold     = $row[tekstindhold];
        $imgaestor         = $row[imgaestor];
       
        print"<img id='pic$id' src='content/upload/$imgaestor' style='display:none'>\n ";
    }

print"</td></tr>";
print"<tr><td></td></tr></table>";

print"</td><td width='100'>";
   
   
//Henter de sidste 5 billeder fra tabellen   
$offset =$offset+$rowCount2;   
$query    ="SELECT * FROM katte_galleri ORDER BY id LIMIT $offset,$rowCount3;";
$result    = mysql_db_query ($database, $query, $link );

    print"<table width='100' border='0' cellspacing='0' cellpadding='0'>";
    while($row = mysql_fetch_array($result)){
        $id                = $row[id];
        $billede        = $row[billede];
        $tekstindhold     = $row[tekstindhold];
        $imgaestor         = $row[imgaestor];
        print"<tr><td><a href='http://kryt.dk/gade'><img src ='content/upload/$billede' width='90' height='70' border='0' onmouseover='swapImages('pic$id')' onmouseout='swapImages('pic$id')'  ></a> </td>
               
            </tr>";
    }   

print"</table></td></tr>";

//Previous knap
$page = $page-1;
print"<tr align='left'><td colspan='3'>";

    if($page>-1){
        print" <a href='?page=galleri&pageparm=$page'>Previous</a> &nbsp;&nbsp;&nbsp;&nbsp;</td>";
    }

   
//Next knap
$page = $page+2;
print"<td colspan='4' align='right'>";
    if($num_rows>$imgCounter){
    print" <a href='?page=galleri&pageparm=$page'>Next</a> &nbsp;&nbsp;&nbsp;&nbsp;</td></tr></table>";
    }

?>
Avatar billede krk Nybegynder
05. april 2005 - 10:09 #1
Avatar billede busschou Praktikant
05. april 2005 - 10:34 #2
så vidt jeg kan se er der i hvert fald et problem her:
activeImg = document.getElementById("pic1").style;
For alle billederne har id pic27 til pic48
Så den kan den ikke finde
Avatar billede krk Nybegynder
05. april 2005 - 10:36 #3
jeg har prøvet at skrive:
activeImg = document.getElementById("pic27").style;
Men det virker heller ikke
Avatar billede busschou Praktikant
05. april 2005 - 10:43 #4
den siger der er syntaksfejl
Jeg kunne forestille mig det måske er pga følgende:
onmouseover='swapImages('pic$id')' onmouseout='swapImages('pic$id')'
At den laver ged fordi det burde være
onmouseover="swapImages('pic$id')" onmouseout="swapImages('pic$id')"
Avatar billede krk Nybegynder
05. april 2005 - 10:44 #5
Okay, men kan jeg godt bruge "-tegnet inde i en print-sætning
Avatar billede busschou Praktikant
05. april 2005 - 10:45 #6
Det er i al fald den eneste umiddelbare forskel på det som virker og det som ikke virker
Så måske du kan bruge følgende
onmouseover=""swapImages('pic$id')"" onmouseout=""swapImages('pic$id')""
for at få gåseøjnene med
Avatar billede busschou Praktikant
05. april 2005 - 10:45 #7
så skal det vist "escapes" som det hedder ved at du laver to efter hinanden mener jeg ""
Avatar billede krk Nybegynder
05. april 2005 - 10:45 #8
det prøver jeg
Avatar billede busschou Praktikant
05. april 2005 - 10:46 #9
doh når det er php så skal du nok bruge \"
altså
onmouseover=\"swapImages('pic$id')\" onmouseout=\"swapImages('pic$id')\"
Avatar billede krk Nybegynder
05. april 2005 - 10:47 #10
okay :-)
Avatar billede krk Nybegynder
05. april 2005 - 10:48 #11
det virker - perfekt.
Tak for hjælpen :-)
Avatar billede busschou Praktikant
05. april 2005 - 10:59 #12
det var så lidt :o)
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
Vi tilbyder markedets bedste kurser inden for webudvikling

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