nicht angemeldet
Angabe der Verzeichnisstruktur
ich habe eine verweis-sensitive imagemap als html-datei (enthält auch ein kurzes java skript).
wenn die png-dateien im selben ordner liegen wie die html-datei dann funktioniert alles wunderbar.
nun will ich die fertige image-map über joomla auf einer website integrieren.
das problem:
joomla läuft in php und ich weiß nicht wie und wo ich die dateipfade zu den fotos eingebe.
ich kann alles fotos zur imagemap über joomla in einen media-ordner hochladen.
in joomla kann ich dann einen neuen beitrag erstellen in dem ich den fertigen html-code einfüge und das ganze als startseite setze.
funktioniert soweit, bloß wird die imagemap nicht angezeigt, da die png-dateien zur imagemap anscheinend nicht gefunden werden. sie liegen ja nun nicht mehr im selben ordner wie die html (oder nun php ?)-datei.
wo in der html-datei muss ich die verzeichnisstruktur eingeben ?
und muss diese absolut vom server (/var/www/html/web387/html/seite/....) angegeben werden oder bloß ab dem joomla-ordner (z.b. /images/site/map) ???
hier einmal der html-code zur image-map:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<script type="text/javascript">
var revert = new Array();
var inames = new Array('map','map','map','map','map','map','map','map','map','map');
// Preload
if (document.images) {
var flipped = new Array();
for(i=0; i< inames.length; i++) {
flipped[i] = new Image();
flipped[i].src = inames[i]+"2.png";
}
for(i=1; i< inames.length; i++) {
flipped[i] = new Image();
flipped[i].src = inames[i]+"3.png";
}
for(i=2; i< inames.length; i++) {
flipped[i] = new Image();
flipped[i].src = inames[i]+"4.png";
}
for(i=3; i< inames.length; i++) {
flipped[i] = new Image();
flipped[i].src = inames[i]+"5.png";
}
for(i=4; i< inames.length; i++) {
flipped[i] = new Image();
flipped[i].src = inames[i]+"6.png";
}
for(i=5; i< inames.length; i++) {
flipped[i] = new Image();
flipped[i].src = inames[i]+"7.png";
}
for(i=6; i< inames.length; i++) {
flipped[i] = new Image();
flipped[i].src = inames[i]+"8.png";
}
for(i=7; i< inames.length; i++) {
flipped[i] = new Image();
flipped[i].src = inames[i]+"9.png";
}
for(i=8; i< inames.length; i++) {
flipped[i] = new Image();
flipped[i].src = inames[i]+"10.png";
}
function over(num) {
if(document.images) {
revert[num] = document.images[inames[num]].src;
document.images[inames[num]].src = flipped[num].src;
}
}
function out(num) {
if(document.images) document.images[inames[num]].src = revert[num];
}
}
</script>
<meta content="text/html; charset=ISO-8859-1" http-equiv="content-type">
<title>Backpacking Down Under</title>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
</head>
<body>
<img src="map1.png" name="map" border="0" usemap="#mapMap" >
<map name="mapMap">
<area shape="poly" coords="587,162,554,174,519,194,494,219,481,266,451,271,414,265,397,279,373,333,332,371,241,400,135,449,94,477,78,513,73,555,86,588,97,618,85,618,98,657,114,699,128,735,149,776,171,825,179,865,168,894,189,924,233,930,277,933,320,923,363,894,424,888,477,885,517,851,568,835,594,826,624,827,647,822,653,752,652,687,650,561,647,473,651,367,647,290,646,238,645,205,625,193,618,174,609,162" href="#"onMouseOver="over(0)"onMouseOut="out(0)">
<area shape="poly" coords="916,91,866,80,833,80,806,96,766,100,746,119,727,120,717,141,707,158,690,175,681,195,657,196,648,223,648,247,646,294,653,588,720,600,776,599,823,601,999,602,1006,509,1007,409,1018,252,977,219,948,199,957,173,973,161,974,133,989,117,999,105,978,102,952,97" href="#"onMouseOver="over(1)"onMouseOut="out(1)">
<area shape="poly" coords="1215,93,1203,139,1191,200,1183,252,1156,288,1120,309,1077,283,1030,252,1016,269,1017,311,1011,370,1006,428,1002,506,1002,546,999,593,1006,606,1092,610,1095,673,1091,710,1166,719,1259,731,1318,737,1387,744,1437,739,1475,742,1510,752,1543,732,1587,724,1582,646,1556,591,1522,538,1498,503,1474,469,1441,432,1395,402,1353,354,1348,302,1341,261,1333,228,1304,203,1276,189,1263,149,1252,109,1243,90,1233,82" href="#"onMouseOver="over(2)"onMouseOut="out(2)">
<area shape="poly" coords="1091,718,1083,812,1079,893,1112,908,1150,935,1180,964,1223,990,1282,992,1322,1009,1337,1039,1370,1047,1385,1048,1400,1020,1410,993,1437,957,1468,925,1501,894,1540,844,1556,801,1576,766,1583,741,1574,722,1551,733,1529,740,1497,753,1472,741,1436,740,1405,747,1329,736,1244,732,1195,725,1124,718" href="#"onMouseOver="over(3)"onMouseOut="out(3)">
<area shape="poly" coords="1077,905,1073,952,1067,1010,1064,1043,1102,1067,1137,1081,1170,1081,1193,1064,1218,1064,1230,1080,1266,1093,1293,1077,1325,1068,1361,1061,1379,1058,1361,1043,1336,1031,1323,1009,1295,997,1254,992,1225,988,1201,979,1172,954,1132,920,1103,905" href="#"onMouseOver="over(4)"onMouseOut="out(4)">
<area shape="poly" coords="759,600,819,602,896,604,950,603,998,606,1048,604,1088,606,1102,639,1092,688,1089,746,1083,806,1081,872,1074,920,1075,968,1067,1032,1059,1033,1037,1004,1012,972,995,967,998,938,985,930,969,938,974,912,981,883,982,865,960,879,948,896,930,909,916,928,902,923,881,891,856,866,832,846,793,815,744,812,709,816,663,820,657,815,657,794,653,684,650,634,651,602,666,598" href="#"onMouseOver="over(5)"onMouseOut="out(5)">
<area shape="poly" coords="1188,1155,1183,1182,1190,1212,1203,1244,1222,1256,1253,1253,1266,1243,1283,1231,1278,1218,1287,1208,1292,1185,1289,1166,1265,1168,1244,1173,1213,1167" href="#"onMouseOver="over(6)"onMouseOut="out(6)">
<area shape="poly" coords="1811,846,1809,863,1815,883,1827,913,1836,932,1844,952,1854,977,1863,1000,1865,1026,1865,1050,1847,1065,1830,1081,1838,1100,1860,1108,1873,1128,1867,1157,1867,1178,1885,1181,1905,1167,1922,1147,1936,1123,1943,1093,1966,1077,1984,1065,1996,1049,2005,1030,2006,1012,1996,1005,1980,1014,1959,1020,1933,1008,1919,977,1908,959,1897,973,1880,963,1879,940,1869,918,1865,904,1852,882,1836,872,1826,860" href="#"onMouseOver="over(7)"onMouseOut="out(7)">
<area shape="poly" coords="1771,1150,1758,1178,1739,1201,1735,1226,1704,1264,1668,1289,1626,1317,1598,1344,1579,1383,1583,1413,1609,1417,1639,1429,1678,1418,1705,1392,1721,1359,1728,1334,1743,1306,1774,1296,1794,1290,1783,1270,1798,1256,1812,1231,1827,1213,1827,1194,1835,1179,1833,1159,1818,1165,1803,1167,1799,1156,1783,1141" href="#"onMouseOver="over(8)"onMouseOut="out(8)">
</map>
</body>
</html>
-
wenn die png-dateien im selben ordner liegen wie die html-datei dann funktioniert alles wunderbar.
Es funktioniert dann wunderbar, wenn die Bilder an der Stelle liegen, die angegeben ist.
wo in der html-datei muss ich die verzeichnisstruktur eingeben ?
Dort wo der Pfad zum Bild anzugeben ist, ist der Pfad zum Bild anzugeben.
...src='bilderordner/bild.png' oder wie auch immer Mit js kenne ich mich nicht aus, das kann aber keine Rolle spielen.
Sollte es so einfach gewesen sein?