Avatar billede muggen Nybegynder
04. april 2005 - 20:51 Der er 12 kommentarer og
1 løsning

onMouseOver billede + celledata

Når jeg hover over et billede, skal jeg have vist et billede i større format + en tilhørende tekst. Data trækkes fra en database og listen af billeder og tekst er dynamisk genereret (ASP/VBScript). Jeg har til dels fundet løsningen på i denne tråd : http://eksperten.dk/spm/387759 men mangler lige og få vist det rigtige billede når jeg hover over billedet. Lige nu er det et statisk billede der vises, men teksten er dynamisk. I kan se hvordan det ser ud lige nu på http://www.m-mdesign.dk/ladybird/planteoversigt_gartneri.asp og jeg vedhæfter her den kode der er brugt til at generere siden. PÅ forhånd tak for hjælpen.

Kode:
<html>

<head>
<meta http-equiv="Content-Language" content="da">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<link rel="stylesheet" type="text/css" href="ladybird.css">
<title>Billede</title>

<script type="text/javascript">


function changeImage()
{
document.getElementById('visBillede').style.visibility=(document.getElementById('visBillede').style.visibility=='hidden')?'visible':'hidden';
}

function gettip(txt)
{
tip.innerHTML=txt
}

function reset()
{
tip.innerHTML=""
}
</script>

</head>

<!--#include file="db.asp"-->

<%
' Open Connection to the database
set conn = Server.CreateObject("ADODB.Connection")
conn.Open xDb_Conn_Str

' Build Query
strsql = "select * from [produkt]"
set rs = Server.CreateObject("ADODB.Recordset")
rs.Open strsql, conn, 1, 2
%>

<body topmargin="0" leftmargin="0" rightmargin="0" bottommargin="0">

<div align="center">
    <table border="0" width="950" id="table1">
        <tr>
            <td colspan="2"><!-- #include file="billede_top.htm" --></td>
        </tr>
        <tr>
            <td></td>
            <td><!-- #include file="menu_top.htm" --></td>
        </tr>
        <tr>
            <td align="center" width="160" valign="top"><!-- #include file="menu_venstre.htm" --></td>
            <td width="790" class="streg" align="left" valign="top">
            <div align="left"><br><br><br>
                <table border="0" width="790" id="table2">
                    <tr>
                        <td width="15">&nbsp;</td>
                        <td width="450"><h4>Gartnerier</h4>

                            <% skift=0 %>
<table border="0" cellpadding="0" cellspacing="0">
<tr>
<%
Do While Not Rs.Eof
skift=skift+1


%>
                                   
                      <td align="center" valign="top" width="100"><font size="2" face="Verdana, Arial, Helvetica, sans-serif"><img height="100" width="100" onmouseover="changeImage();gettip('<%= rs("sort")%>')" onmouseout="changeImage();reset()" src="produkter/<%= rs("billede")%>"<br><br><%= rs("sort")%></font></td>
                      <td align="left" valign="top" width="10"> <p align="left"><font size="2" face="Verdana, Arial, Helvetica, sans-serif">&nbsp;</font></td>
<%if skift=4 then
    response.write("</tr><tr>")
    skift=0
  end if
%>

                 
<%
Rs.MoveNext
Loop
%>
</tr>
</table>
                       
                        </td>
                        <td width="325">

                            <div align="center"><div id="visBillede" style="text-align:center;visibility:hidden;">
        <img id="bigImage" onmouseover="changeImage()" border="0" width="225" height="225" src="landscape3.gif"><p id="tip"></p></div></div>                       

                        </td>
                    </tr>
                </table>
            </div>
            </td>
        </tr>
        <tr>
            <td colspan="2"><!-- #include file="billede_bund.htm" --></td>
        </tr>
    </table>
</div>

</body>

</html>
Avatar billede busschou Praktikant
04. april 2005 - 22:51 #1
Avatar billede busschou Praktikant
04. april 2005 - 22:54 #2
så jeg tror at hvis du giver dit billede fx et name="bigImage"
Så bør du kunne lave din billede skift som
function changeImage(kilde)
{
document.getElementById('visBillede').src=kilde
document.getElementById('visBillede').style.visibility=(document.getElementById('visBillede').style.visibility=='hidden')?'visible':'hidden';
}
----
og så skal du jo blot kalde funktionen med kilden
Avatar billede busschou Praktikant
04. april 2005 - 22:55 #3
vrøvl:
document.getElementById('bigImage').src=kilde
Avatar billede busschou Praktikant
04. april 2005 - 22:56 #4
og den har jo selvfølgelig allerede det id så du behøver nok ikke engang at give den et navn :o)
Se om du kan bruge det til lidt :o)
Avatar billede busschou Praktikant
05. april 2005 - 12:33 #5
håber du kunne se ideen idet jeg skrev igår aftes...var vist lidt træt :o)
-----------------
function changeImage(kilde)
{
document.getElementById('bigImage').src=kilde
document.getElementById('visBillede').style.visibility=(document.getElementById('visBillede').style.visibility=='hidden')?'visible':'hidden';
}
----------
Avatar billede busschou Praktikant
20. april 2005 - 12:28 #6
kunne det bruges og er det lukketid?
Avatar billede muggen Nybegynder
09. juli 2005 - 23:55 #7
busschou - send som svar og så får du dine point!
Avatar billede busschou Praktikant
10. juli 2005 - 07:10 #8
svar :O)
Avatar billede muggen Nybegynder
20. januar 2006 - 14:22 #9
Prøver lige igen.
Avatar billede muggen Nybegynder
20. januar 2006 - 14:22 #10
Prøver lige igen
Avatar billede muggen Nybegynder
20. januar 2006 - 14:23 #11
Der sker ingenting når jeg trykker Accepter - Øv.
Avatar billede roenving Novice
20. januar 2006 - 16:01 #12
-- og så fandt du åbenbart ud af, at man skal markere et brugernavn i boksen til venstre før man trykker på Acceptér !-)
Avatar billede muggen Nybegynder
08. februar 2006 - 16:04 #13
Ja, jeg lærer det jo nok på et tidspunkt.
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