Geen link in FF, wel in IE

[kris.gua]

Hallo,

Ik heb van een foto een link naar een andere pagina met meer foto’s gemaakt. Om van die pagina terug te keren naar mijn website heb ik aan de rechterkant links naar de pagina’s van mijn website gezet. In IE is er geen probleem, maar in FF werken de links niet als link. (Het pijltje verandert zelfs niet in een handje.) Ze hebben wel het uitzicht van een link.
Er is dus duidelijk iets fout, maar ik vind niet wat. Wie kan me helpen?
Klik op de foto op
http://www.triangulovzw.be/kristri/projecten.php
dan komt u op betreffende pagina:
http://www.triangulovzw.be/kristri/waarvoorwie.htm

(Ik heb van die pagina geen pop-up gemaakt omdat het me nog wat te moeilijk leek: ik moet dan een javascript in een javascript gebruiken, denk ik toch, zonder dat er conflicten optreden. Daarom heb ik voor deze oplossing gekozen.)

Alvast bedankt!

Kris

[ultddave]

Beste,

Ik weet niet of je het al doet, ik vermoed van niet. Maar het is handig om banners, menu's en footers in apparte .html bestanden te zetten.

Via PHP moet je die dan enkel "includen" waar je ze wilt hebben. Als je dan een aanpassing doet aan je menu.html file bijvoorbeeld, dan wordt dat direct toegepast op elke pagina die de pagina include. Anders moet je bijvoorbeeld op elke pagina van je website dat menu handmatig nog gaan aanpassen.

Bijvoorbeeld:

Code: Selecteer alles

<div id="menu">
<a title="Home" style="background: #43745e" href="home.php">Home</a>
<a title="Vzw" style="background: #669933" href="vzw.php">Vzw</a>
<a title="Projecten" style="background: #669966" href="projecten.php">Projecten</a>
<a title="Steun" style="background: #cc0033" href="steun.php">Steun <br/>BBQ</a>
<a title="Brieven" style="background: #18422e" href="brieven.php">brieven<br/>nieuws</a>
<a title="Fotoalbum"  style="background: #003399" href="fotoalbum.php">Fotoalbum</a>
<a title="Guatemala" style="background: #666699" href="guatemala.php">Guatemala</a>
<a title="Links" style="background: #ff9900" href="links.php">Links</a>
<a title="Archief" style="background: #00ff00" href="archief.php">Archief</a>
<a title="Nieuw" style="background: #669900" href="nieuw.php">Nieuw</a>
<a title="Contact" style="background: #cc0033" href="contact.php">Contact</a>
<a title="Gastenboek" style="background: #666633; font-size: 9px" href="gastenboek.php">Gastenboek</a>
<a title="Zoeken" style="background: hidden; font-size: 2px; width: 2px" href="zoeken.php">z</a><div id="login"><a title="Login" href="login1.php">Login</a></div>
</div>

Zet je in een bestand menu.html.

En op je pagina's zet je dan:

Code: Selecteer alles

<?php 

if(file_exists('menu.html')) 
include('menu.html'); 

?> 

Waar je dat menu wilt plaatsen. PHP gaat die HTML code dan in principe "plakken" op de plaats van je "include" statement.

Indien je die methode al gebruikt is het uiteraard goed .

***********

Over je concreet probleem; Bij mij werken de linken in zowel firefox als IE9.

PS: In de code van het menu op die waarvoorwie.htm pagina:

Code: Selecteer alles

<a href="home.php">homepagina</a></p>
<a href="vzw.php">Vzw</a></p>

<a href="projecten.php">Projecten</a></p>
<a href="steun.php">Steun/BBQ</a></p>
<a href="brieven.php">Brieven</a></p>
<a href="fotoalbum.php">Fotoalbum</a></p>
<a href="guatemala.php">Guatemala</a></p>
<a href="links.php">Links</a></p>
<a href="archief.php">Archief</a></p>
<a href="nieuw.php">Nieuw</a></p></div>

staan allemaal "</p>" tags voor het sluiten van een paragraph. Maar die <p> tags worden nergens geopend?

Heb je je niet vergist met de <br/> tag voor het plaatsen van een "einderegel" teken.

Mvg,
Dave

[ultddave]

PS: Als je met "popup" een nieuw venster bedoelt:

HTML 4.01 manier:
<a href="waarvoorwie.htm" target="_blank">Paginanaam</a>

XHTML manier:
<a href="waarvoorwie.htm" rel="external" onclick="this.target='_blank';">Paginanaam</a>

Je kan in principe met een heel script werken, maar als je maar 1 link hebt die een popup moet openen, kan je best bovenstaande methode gebruiken.

Maar popups en dergelijke worden zoiezo al afgeraden in XHTML.

Mvg,
Dave

[Gast]

Hoi Dave

Ik weet niet in welke browsers je de webpagina allemaal geopend hebt. Ik heb ze geopend in IE en FF. Ik kom ook tot de conclusie dat die sublinken in IE wel werken en in FF niet.

[coderunner]

Beste Kris,

De oorzaak van dit alles is dat je tags verkeerd afsluit (sommige </div>) en soms niet opent maar wel afsluit (bv. <p>).
In jouw gebruikte code
rood = mag weg
blauw = toevoegen
groen = afstand top eventueel verkleinen

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>

<head>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">

<title>waar en voor wie</title>

<script language="JavaScript" type="text/javascript">
<!--window.onload = resizeTo(900,900), moveTo(200,200);->
</script>

<style>
body {text-align: center; font: 12px verdana}
#container {
position:absolute;
width:1100px;
height:800px;
left:50%;
margin-left:-500px;
}

a img {width: 90px; border: none; margin: 5px; opacity:0.7; filter:alpha(opacity=70)}
a:hover img {opacity:1.0; filter:alpha(opacity=100)}
#thumbnails {width: 120px; height: 460px; margin: 50px 50px 2px 50px; overflow: auto; float: left}
#fotovak {float: left; width: 600px; margin: 60px 10px 10px 10px; padding: 10px; border: 1px solid blue}
#fotovak img {width: 200px}
</style>

<script>
var fotoReeks = new Array(19);
for (i = 0; i < fotoReeks.length; i ++){
fotoReeks = new Image();
fotoReeks.src = 'waarwie/foto' + i + '.jpg';
}
function toon(f1, f2){
document.getElementById('foto1').src = f1;
document.getElementById('foto2').src = f2;
}
</script>

</head>

<body>

<div id="container">

<div id="thumbnails">
<script>
var t = 1;
for (var i = 0; i < fotoReeks.length; i ++){
document.write('<a href="#" onClick="toon(\'' + fotoReeks.src + '\', \'' + fotoReeks[t].src + '\')"><img src="' + fotoReeks.src + '" /></a><br />');
t++;
if (t == fotoReeks.length){
t = 0;
}
}

</script>
</div>

<div id="fotovak">
<h1>Waar en voor wie ?</h1>
<img src="waarwie/foto0.jpg" id="foto1" style="float: left;">
<img src="waarwie/foto1.jpg" id="foto2" style="float: right;">
El Tumbador ligt midden in de bergen. Een prachtige streek, maar met veel armoede.
</div>

</div>

<div style="float:right; padding:50px 50px 5px 20px;">
<p><a href="home.php">homepagina</a></p>
<p><a href="vzw.php">Vzw</a></p>
<p><a href="projecten.php">Projecten</a></p>
<p><a href="steun.php">Steun/BBQ</a></p>
<p><a href="brieven.php">Brieven</a></p>
<p><a href="fotoalbum.php">Fotoalbum</a></p>
<p><a href="guatemala.php">Guatemala</a></p>
<p><a href="links.php">Links</a></p>
<p><a href="archief.php">Archief</a></p>
<p><a href="nieuw.php">Nieuw</a></p>
</div>

<div style="clear:both"></div>

<div style="margin-top:150px; padding-left: 80px; padding-bottom:20px;">
<p >Om terug te keren naar de website: gebruik de terugkeertoets
bovenaan in de adresbalk , of klik op een link.</p>
<img src="bestanden/images/stofboordje1.jpg" alt="">
</div>
</div>

</div>


</body>

</html>

De verbeterde code is

Code: Selecteer alles

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>

<head>

<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">

<title>waar en voor wie</title>

<script language="JavaScript" type="text/javascript">
<!--window.onload = resizeTo(900,900), moveTo(200,200);->
</script>
<style>
body {text-align: center; font: 12px verdana}
#container {
position:absolute;
width:1100px;
height:800px;
left:50%;
margin-left:-500px;
}
a img {width: 90px; border: none; margin: 5px; opacity:0.7; filter:alpha(opacity=70)}
a:hover img {opacity:1.0; filter:alpha(opacity=100)}

#thumbnails {width: 120px; height: 460px; margin: 50px 50px 2px 50px; overflow: auto; float: left}
#fotovak {float: left; width: 600px; margin: 60px 10px 10px 10px; padding: 10px; border: 1px solid blue}
#fotovak img {width: 200px}
</style>

<script>
var fotoReeks = new Array(19);							
for (i = 0; i < fotoReeks.length; i ++){
  fotoReeks[i] = new Image();
  fotoReeks[i].src = 'waarwie/foto' + i + '.jpg';
}
function toon(f1, f2){
  document.getElementById('foto1').src = f1;
	document.getElementById('foto2').src = f2;
}
</script>

</head>

<body>

<div id="container">

		<div id="thumbnails">
		<script>
		var t = 1;
		for (var i = 0; i < fotoReeks.length; i ++){
		  document.write('<a href="#" onClick="toon(\'' + fotoReeks[i].src + '\', \'' + fotoReeks[t].src + '\')"><img src="' + fotoReeks[i].src + '" /></a><br />');
			t++;
			if (t == fotoReeks.length){
			  t = 0;
			}
		} 
		</script>
		</div>


		<div id="fotovak">
		<h1>Waar en voor wie ?</h1>
		<img src="waarwie/foto0.jpg" id="foto1" style="float: left;">
		<img src="waarwie/foto1.jpg" id="foto2" style="float: right;">
		El Tumbador ligt midden in de bergen. Een prachtige streek, maar met 
		veel armoede.
		</div>


		<div style="float:right; padding:50px 50px 5px 20px;">
		<p><a href="home.php">homepagina</a></p>
		<p><a href="vzw.php">Vzw</a></p>
		<p><a href="projecten.php">Projecten</a></p>
		<p><a href="steun.php">Steun/BBQ</a></p>
		<p><a href="brieven.php">Brieven</a></p>
		<p><a href="fotoalbum.php">Fotoalbum</a></p>
		<p><a href="guatemala.php">Guatemala</a></p>
		<p><a href="links.php">Links</a></p>
		<p><a href="archief.php">Archief</a></p>
		<p><a href="nieuw.php">Nieuw</a></p>
		</div>

		<div style="clear:both"></div>
		<div style="margin-top:50px; padding-left: 80px; padding-bottom:20px;">
		<p >Om terug te keren naar de website: gebruik de terugkeertoets 
		bovenaan in de adresbalk , of klik op een link.</p>
		<img src="bestanden/images/stofboordje1.jpg" alt="">
		</div>
</div>

</body>

</html>

mvg,
Coderunner

[ultddave]

Ik weet niet in welke browsers je de webpagina allemaal geopend hebt.

FireFox 3.6.12
IE9 Beta
Google Chrome
Safari 5.0.2
Opera 10.53

De linken aan de rechterkant van deze pagina;
http://www.triangulovzw.be/kristri/waarvoorwie.htm

Werken daar zonder problemen bij mij.

Mvg,
Dave

[kris.gua]

Hallo allemaal,

Bedankt voor al die reacties! Ik heb de verbeterde code van Coderunner erop gezet, en nu werkt het perfect. Wat een verwennerij! Ik moest het zelfs niet meer zelf aanpassen. (Ik heb het wel goed bekeken, natuurlijk.)
Zoals ook Dave zei, had ik me inderdaad vergist, en wilde eigenlijk de <br/> tag zetten.

Ik zet al veel in aparte bestanden en werk met include, maar if(file_exists('menu.html')) zette ik er nog niet bij. Dat is een prachtige suggestie.
Kan ik, in plaats van
<?php
if(file_exists('menu.html'))
include('menu.html');
?>
ook
<?php
if(file_exists(' '))
include('menu.html');
?>
gebruiken? Dan moet ik alleen de include aanpassen en heb ik minder kans me te vergissen of iets te vergeten. (Ik betrap mezelf regelmatig op zo 'n stommiteit, maar kijk er ook dikwijls over.)

De reden dat ik dit anders opgevat heb, is dat er al meer dan genoeg tabbladen staan. Maar misschien kan ik van het menu een tab van 0 px breed maken en background: hidden;. (Kan width: 0px; eigenlijk wel?) En met include werken zoals de andere pagina’s. Ik veronderstel dat het dan ook duidelijk is voor bezoekers dat ze terug op het menu moeten klikken om terug te gaan. Ik zal er eens over denken.

Ook Francois12 bedankt om te melden dat het bij u ook niet werkte in FF.

Groetjes,

Kris

[ultddave]

Beste,

Code: Selecteer alles

<?php 
if(file_exists(' ')) 
include('menu.html'); 
?> 

Kan je best niet gebruiken als je die file_exists niet gaat gebruiken. Je moet die if test dan gewoon weglaten.

Code: Selecteer alles

<?php
include('menu.html');
?>

Als menu.html niet zou bestaan, gaat het script wel verder uitvoeren.

Als je wilt dat de pagina dan een foutmelding toont en stopt met de uitvoering moet je dit gebruiken:

Code: Selecteer alles

<?php
require('menu.html');
?>

'require' zorgt ervoor dat je pagina niet getoond wordt tgv een PHP fout (Indien het bestand menu.html dus niet zou bestaan). Require wordt dus vaak gebruikt bij bestanden die noodzakelijk zijn voor de werking van de site.

Die if(file_exists('menu.html')) gaat zoals je wel verwacht, eerst kijken of het bestand menu.html bestaat. En in dat geval die includen.

Mvg,
Dave

[kris.gua]

Dag Dave,

Bedankt voor de uitleg!

Kris

[coderunner]

Ik heb de verbeterde code van Coderunner erop gezet, en nu werkt het perfect. Wat een verwennerij! Ik moest het zelfs niet meer zelf aanpassen. (Ik heb het wel goed bekeken, natuurlijk.)

Beste Kris,

Goed te horen dat de links nu ook in FF werken.

Bedankt om dit te laten weten.

Nog een fijne avond.

mvg,
Coderunner