Lægge to billeder oven på hinanden

<div id="imgs" style="position:relative;">
<img src="" style="width:300px;height:200px;z-index:0;position:absolute;">
<img src="" style="width:300px;height:200px;z-index:1;filter:alpha(opacity=50);-moz-opacity:0.5;position:absolute;">
</div>

Men hvordan vælger man dem?!.. ALtså.. F.eks. ved en drop down?! :)

http://www.html.dk/tutorials/css/lektion15.asp

//>Rune

Giver dem et name, f.eks. hhv name="baggrund" og name="billede"

og så:

<select onchange="document.images['baggrund'].src=this.value">
  <option value="">Vælg baggrund</option>
  <option value="billeder/gul.gif">Gul baggrund</option>
  <option value="billeder/hvid.gif">Hvid baggrund</option>
</select>

Okay!! Cool nok!..

Måske er det i virkeligheden det med drop-downs, jeg skal bruge hjælp til!.. Suk.. Virker lidt uoverskueligt lige nu! :-S

<script>
function valg(){

var billede = document.formNavn.billede.value;
var farve = document.formNavn.farve.value

tmp = "<img src=\"" + farve + "\" style=\"width:300px;height:200px;z-index:0;position:absolute;\">";
tmp = tmp + "<img src=" + billede + " style=width:300px;height:200px;z-index:1;filter:alpha(opacity=50);-moz-opacity:0.5;position:absolute;>";
document.getElementById('imgs').innerHTML = tmp;
}
</script>


<div id="valg">

<form name="formNavn">

<select name="farve" onChange="valg();">
<option value="green.jpg">Green</option>
<option value="red.jpg">Red</option>
</select>

<select name="billede" onChange="valg();">
<option value="1.jpg">1</option>
<option value="2.jpg">2</option>
</select>

</form>

</div>

<div id="imgs">
</div>

Dropdownsene kan du så lave med asp, så du får billedtitlerne fra din db.

Hov ja, roenving, det var da grumt meget smartere...

<div id="valg">

<form name="formNavn">

<select name="farve" onChange="document.images['farve'].src=this.value;">
<option value="green.jpg">Green</option>
<option value="red.jpg">Red</option>
</select>

<select name="billede" onChange="document.images['billede'].src=this.value;">
<option value="1.jpg">1</option>
<option value="2.jpg">2</option>
</select>

</form>

</div>

<div id="imgs">
<img id="farve" src="" style="width:300px;height:200px;z-index:0;position:absolute;">
<img id="billede" src="" style="width:300px;height:200px;z-index:1;filter:alpha(opacity=50);-moz-opacity:0.5;position:absolute;">
</div>

Hvis vi leger, at du har to tabeller i din db - en med farver og en med billeder - og at hver af de tabeller har to felter - billede og titel - så vil det kunne se nogenlunde sådan her ud:

<%
Set rs = Server.CreateObject("ADODB.RecordSet")
Set Conn = Server.CreateObject("ADODB.Connection")
strDSN = "Provider=Microsoft.Jet.OLEDB.4.0; Data Source=" & Server.MapPath("database.mdb")
Conn.Open strDSN
%>

<div id="valg">

<form name="formNavn">

<select name="farve" onChange="document.images['farve'].src=this.value;">

<%
strSQL = "select * from farver"
rs.Open strSQL, Conn

Do until rs.eof
  response.Write "<option value='" & rs("billede") & "'>" & rs("titel") & "</option>"
  rs.moveNext
Loop

rs.close
%>

</select>

<select name="billede" onChange="document.images['billede'].src=this.value;">

<%
strSQL = "select * from billeder"
rs.Open strSQL, Conn

Do until rs.eof
  response.Write "<option value='" & rs("billede") & "'>" & rs("titel") & "</option>"
  rs.moveNext
Loop

rs.Close
set rs = Nothing

Conn.Close
set Conn = nothing
%>

</select>

</form>

</div>

<div id="imgs">
<img id="farve" src="" style="width:300px;height:200px;z-index:0;position:absolute;">
<img id="billede" src="" style="width:300px;height:200px;z-index:1;filter:alpha(opacity=50);-moz-opacity:0.5;position:absolute;">
</div>

-- og så var det _meget_ med vilje, at jeg startede med en tom option, for ellers forekommer onchange jo ikke, når man vil vælge den første option !-)

Hehe - ja, selvfølgelig...
Endnu en gang må jeg sige "Hov ja, roenving, det var da grumt meget smartere..."

TUSIND tak!

Jeg skal nok lade være med at glemme jer.. Men skal lige bruge noget tid til at prøve det. Er jo, ligesom I sikkert også er, travlt optaget i disse dage! :)

Men.. Rigtig god jul! Vender snarest tilbage!!

Hej igen!

Jeg har ikke rigtig fået det lavet endnu.. Hehe..

Men er det okay, hvis jeg giver jer 75 hver?! :)

100 til roenving og 50 til mig er nok mere fair...

-- Håber du kommer på med løsningen !-)

-- og velbekomme '-)

-- og tak for points ;~}

Også tak herfra :)