Just nu i M3-nätverket
Gå till innehåll
Eforum är stängt för nya inlägg och svar sedan 20 juni 2022. Klicka för att läsa vad som hände och om alternativ.

Imagemap och javascript på samma bild

IvanB

Startad av IvanB,
i Webbutveckling

Rekommendera Poster

IvanB

IvanB

Postad
Postad

Det finns ett litet foto (porträtt) hängande närmast till den stora spegeln på http://web.comhem.se/halvklar/galleri.htm. Jag vill göra den klickbar, den ska öppna en liten serie av bilder. De bilderna ska inte poppa upp i spegel som de andra, utan helt vanligt, som självtändig bildvisning utan javascript. Hur ska jag skriva in imagemap-koderna utan att störa eller förstöra javascriptet?

 

 

 

[inlägget ändrat 2007-10-12 00:34:02 av IvanB]

Länk till kommentar
Dela på andra webbplatser
Micke_skane

Micke_skane

Postad
Postad

Du har inget javascript kopplat till den stora spegelbilden.

Scriptet är kopplat till dem små till höger och till bilden som ligger under spegelbilden.

 

Det är bara att köra på med att sätta spegelbilden som imagebild och sätta ut koordinaterna där dem ska vara.

Se mer här:

http://www.htmlcodetutorial.com/images/images_famsupp_220.html

 

Eller du kanske menar att du vill koppla ett javascript till länken som kommer att finnas på porträttet?

Vill du att det ska öppnas ett nytt fönster med bildgalleriet?

 

[inlägget ändrat 2007-10-12 07:38:47 av Micke_skane]

Länk till kommentar
Dela på andra webbplatser
IvanB

IvanB

Postad
  • Trådskapare
Postad

Det gick åt pipan, ajälvklart. "Resultatet" ser du på

http://web.comhem.se/consoler/. Jag har inte rört /halvklar-sidan, den funkar fortfarande.

Ja, det är kanske javascript som är passande. Jag har 4 bilder om den här mycket speciella kunden, som ska inte öppnas i spegeln som andra vanliga dödliga, utan han får en egen liten album som ska öppnas ovanpå sidan, med möjlighet att återvända direkt. Så det spelar ingen roll för mig, om det är imagemap eller javascript, det som är enklast. Samtidigt jag vill lära mig allt i praktiken, därför tänkte jag testa om jag kunde göra imagemap. Men jag är ungefär lika bra på javascript....

 

Länk till kommentar
Dela på andra webbplatser
Micke_skane

Micke_skane

Postad
Postad

Ska se om jag hinner visa Dig och titta på vad du gjort.

Nu får jag avsätta mer tid till betalande kunder :)

 

Länk till kommentar
Dela på andra webbplatser
IvanB

IvanB

Postad
  • Trådskapare
Postad
Nu får jag avsätta mer tid till betalande kunder :)

 

Helt rätt, det skulle jag också göra. Jag är överhuvudtaget förstummad av beundran att du och några till (ingen nämnd, ingen glömd) är så hjälpsamma och ger snabba och noggranna svar.Det finns kanske någon annan under tiden som har tid/lust/ork att kolla mitt problem.

 

Länk till kommentar
Dela på andra webbplatser
Micke_skane

Micke_skane

Postad
Postad

Okej, om du inte själv löst det så gjorde jag en variant på det jag hjälpte dig innan med:

 

I script-blocket som redan finns för thumbes lägger du in denna:

function OpenGalleri() {
var oGalleri=window.open("galleri.html","Galleri","width=400,height=400");
}

Viktigt här att raden som börjar med var oGalleri= är på En rad!

 

Efter <body> lägger du denna:

<map name="owe">
<area href="#" alt="Se galleri" title="Se galleri" shape="rect" coords="300,245,360,345" onclick="OpenGalleri();return false;">
</map>

Även är ska raden som börjar med <area vara på En rad!

 

I spegelramsbilden lägger du till detta:

usemap="#owe"

 

[inlägget ändrat 2007-10-12 16:52:45 av Micke_skane]

Länk till kommentar
Dela på andra webbplatser
IvanB

IvanB

Postad
  • Trådskapare
Postad

Äntligen hann jag göra vad du sa och du ser på web.comhem.se/consoler vad det blev. IE behöll layouten, FF collapsade och ingen av dem visar onclick. Är det jag som missade någonting? Jag bara klippte och klistrade, exakt dit du sa och var någa med att undvika radbrytnng.

 

Länk till kommentar
Dela på andra webbplatser
Micke_skane

Micke_skane

Postad
Postad

Du har fått det fel på sidan.

 

Ändra funktionen till:

function OpenGalleri() {

var oGalleri=window.open(...);

}

 

Där är inga mellanslag i map-strängen efter:

"Se galleri"

 

Ska vara:

"Se galleri" shape="rect" coords="300,245,360,345" onclick

 

Kan vara lurigt att kopiera ifrån Eforum.

 

[inlägget ändrat 2007-10-13 23:20:23 av Micke_skane]

Länk till kommentar
Dela på andra webbplatser
IvanB

IvanB

Postad
  • Trådskapare
Postad

Jag klistrade in den nya, men ingenting har förändrats. Fungerar den för dig? Kan du lägga ut den tillfälligt någonstans? Här kommer spegeln bifogad.

 

[bild bifogad 2007-10-14 13:49:48 av IvanB]

989587_thumb.jpg

Länk till kommentar
Dela på andra webbplatser
Micke_skane

Micke_skane

Postad
Postad

Du har lagt in map:en Två gånger.

Det räcker att den ligger en gång under <body>, precis som du gjort. Så ta bort den andra du lagt in längre ner i koden.

 

Ta även bort den extra > som är precis efter </map> som tillhör den extra map:en du lagt in och som du ska ta bort.

 

Sen har du glömt att säga till spegelbilden att den ska navända map:en som heter owe.

Det gör du genaom att lägga till i img-taggen för spgelramen följande:

usemap="#owe"

Ex: ... height="890" width="485" usemap="#owe" />

 

Sen har du tagit bort en } i scriptblocket.

Ska vara:

function Show(img) {
document.getElementById('ImgBottom').src=img;
}
function Hide() {
document.getElementById('ImgBottom').src="blank.jpg";
}
function OpenGalleri() {
var oGalleri=window.open([color="#0000ff"]lägg in det jag visade innan[/color]);
}

[inlägget ändrat 2007-10-14 14:16:28 av Micke_skane]

Länk till kommentar
Dela på andra webbplatser
IvanB

IvanB

Postad
  • Trådskapare
Postad

Tack, Micke. Dina svar kommer på studs, men jag måste springa iväg igen, jag återkommer och då ska jag kolla noga så att det inte blir flera tabbar. Förhoppningsvis.

 

Länk till kommentar
Dela på andra webbplatser
IvanB

IvanB

Postad
  • Trådskapare
Postad

Du är mycket hjälpsam och jag är tacksam. Det blev något fel ändå. Nu på web.comhem.se/halvklar. Jag kunde inte låta bli trots en massa andra förpliktelser omkring mig att snabbt stoppa in hela sidan du har gjort i web.comhem.se/halvklar. Den såg bra ut i IE, jag kollade bara den, sedan bytte jag namn och med namnbytet tog jag bort den gamla galleri.html. Jag tog det för givet att din sida funkar bra i FF. Men som du ser, FF vill inte visa den rätt.

 

Länk till kommentar
Dela på andra webbplatser
Micke_skane

Micke_skane

Postad
Postad

På den "halvklara" sidan finns ju inget javascript kvar i koden.

Var har du gjort av det?

 

Kolla på länken jag lade in innan, den visar hur gallerisidan ska vara.

Här är den igen :)

http://rafb.net/p/Mgtop599.html

 

Kom på det också, att det är rätt bra om tråden får en bra rubrik och att man inte ändrar den sen. Detta har betydelse när andra ska söka på liknade problem i forumet.

 

[inlägget ändrat 2007-10-14 17:47:27 av Micke_skane]

Länk till kommentar
Dela på andra webbplatser
IvanB

IvanB

Postad
  • Trådskapare
Postad

Jag var lite stressad och tog en fil med samma namn från en annan mapp. Nu är det rätt fil och nu gäller det som jag skrev förut: IE visar den rätt, FF kollapsar.

Jag återgick till den ursprungliga rubriken, nu vet jag.

 

Länk till kommentar
Dela på andra webbplatser
Micke_skane

Micke_skane

Postad
Postad

Jag testade inte direkt i FF(vet inte varför) men felet ligger nog i denna:

background-image: url (background-image: url(bilder/alex.jpg);

 

Ska vara:

background-image: url(bilder/alex.jpg);

 

Länk till kommentar
Dela på andra webbplatser
IvanB

IvanB

Postad
  • Trådskapare
Postad

Mitt i prick!

Micke, tack så mycket för all hjälp! Nu kan jag äntligen fixa bilderna, bland annat bakgrundsbilden i spegeln. Får jag påstå, att jag har också gjort någonting där?

Om inte annat, jag har lärt mig mycket av dig och jag ska gå genom varenda rad så att nästa gång ska jag klara mig på egna ben.

 

Länk till kommentar
Dela på andra webbplatser
IvanB

IvanB

Postad
  • Trådskapare
Postad

Jag trodde, att det var slut på den här topicen. Jag har inte rört nagelbilderna. De funkade förut, men ingenting som rör sig där nu.

 

[inlägget ändrat 2007-10-15 01:40:54 av IvanB]

Länk till kommentar
Dela på andra webbplatser
Micke_skane

Micke_skane

Postad
Postad

Det saknar några "fnuttar" i onmouseover-händelsen för bild1 och bild2.

 

onmouseover="Show('bilder/spegelbild1.jpg');"

onmouseover="Show('bilder/spegelbild2.jpg');"

 

Har markerat dem som du ska sätta dit med blå färg.

 

Länk till kommentar
Dela på andra webbplatser
Micke_skane

Micke_skane

Postad
Postad

Jag tror jag vet vad som ställer till det nu för dig :)

Du har satt en bakgrundsfärg för spegelbilden och då blir ju inte den genomskinlig i just spegeln.

Då ser du ju inte heller bilden bakom.

 

Så ta bort bakgrundsfärgen i:

#ImgMirror {

position:absolute;

top:0px;

left:100px;

z-index:100;

border: 0;

background-color: #d3d3d3;

}

 

Vill du nu ha en annan bakgrundsfärg i spegeln så gör det i ursprungsbilden som ligger där från början.

 

Länk till kommentar
Dela på andra webbplatser

Arkiverat

Det här ämnet är nu arkiverat och är stängt för ytterligare svar.

Gå till ämneslista


×
×
  • Skapa nytt...