plaatje centreren lukt niet

Status
Niet open voor verdere reacties.
C

clochard

Gebruiker
Lid geworden
13 jul 2009
Berichten
8
Hallo,

Ik heb een pagina gemaakt om plaatjes te tonen, een plaatje wordt uitvergroot middels een mouseover. Lukt allemaal prima alleen, de grote foto komt niet mooi midden in de pagina te staan maar aan de rechterkant. Ik kan uit het script helaas niet herleiden waar dit door komt.
Ook laden de plaatje nogal traag en schokkerig, dus niet echt vloeiend...
Kan iemand mij helpen?

Alvast dank!

Het script luidt:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Untitled</title>
<script type="text/javascript">
// hier definieer je alle afbeeldingen
var afbeeldingen=new Array()
afbeeldingen[0]=["plaatjes van foto naar schilderij/bloem1.jpg", "#"] // "pad en naam van de foto", "eventuele hyperlink"
afbeeldingen[1]=["plaatjes van foto naar schilderij/bloem2.jpg", "#"]
afbeeldingen[2]=["plaatjes van foto naar schilderij/bloem3.jpg", "#"]
afbeeldingen[3]=["plaatjes van foto naar schilderij/bloem4.jpg", "#"]
afbeeldingen[4]=["plaatjes van foto naar schilderij/bloem5.jpg", "#"]
afbeeldingen[5]=["plaatjes van foto naar schilderij/bloem6.jpg", "#"]
afbeeldingen[6]=["plaatjes van foto naar schilderij/bloem7.jpg", "#"]
afbeeldingen[7]=["plaatjes van foto naar schilderij/bloem8.jpg", "#"]
afbeeldingen[8]=["plaatjes van foto naar schilderij/slak1.jpg", "#"]
afbeeldingen[9]=["plaatjes van foto naar schilderij/steiger1.jpg", "#"]
afbeeldingen[10]=["plaatjes van foto naar schilderij/steiger5classicround.jpg", "#"]



var voorladen="ja" // "ja" of "nee"
var optlinktarget="" // optioneel: hier kun je een target invullen bij framesgebruik
var beeldrandbreedte=0
var filterstring="progid:DXImageTransform.Microsoft.GradientWipe(GradientSize=1.0 Duration=0.7)"

// hieronder niets wijzigen

if (voorladen=="ja"){
for (x=0; x<afbeeldingen.length; x++){
var ditbeeldje=new Image()
ditbeeldje.src=afbeeldingen[x][0]}}

function beeldcode(dezeafbeelding){
var beeldhtml=""
if (dezeafbeelding[1]!="")
beeldhtml='<a href="'+dezeafbeelding[1]+'" target="'+optlinktarget+'">'
beeldhtml+='<img src="'+dezeafbeelding[0]+'" border="'+beeldrandbreedte+'">'
if (dezeafbeelding[1]!="")
beeldhtml+='</a>'
return beeldhtml}

function wijzigbeeld(beeldplaatsing, beeldindex){
if (document.getElementById){
var imgobj=document.getElementById(beeldplaatsing)
if (imgobj.filters && window.createPopup){
imgobj.style.filter=filterstring
imgobj.filters[0].Apply()}
imgobj.innerHTML=beeldcode(afbeeldingen[beeldindex])
if (imgobj.filters && window.createPopup)
imgobj.filters[0].Play()
return false}}
</script>


</head>

<body bgcolor="black">
<center>

<font color="white" font size="+4"><B>van foto naar schilderij</b></font><br><br><br>
<a href="#" onMouseover="wijzigbeeld('beeldplaatsing', 0)">
<img src="plaatjes van foto naar schilderij/bloem1.jpg" width= 40 height=30 border=0></a>
<a href="#" onMouseover="wijzigbeeld('beeldplaatsing', 1)">
<img src="plaatjes van foto naar schilderij/bloem2.jpg" width= 40 height=30 border=0></a>
<a href="#" onMouseover="wijzigbeeld('beeldplaatsing', 2)">
<img src="plaatjes van foto naar schilderij/bloem3.jpg" width= 40 height=30 border=0></a>
<a href="#" onMouseover="wijzigbeeld('beeldplaatsing', 3)">
<img src="plaatjes van foto naar schilderij/bloem4.jpg" width= 40 height=30 border=0></a>
<a href="#" onMouseover="wijzigbeeld('beeldplaatsing', 4)">
<img src="plaatjes van foto naar schilderij/bloem5.jpg" width= 40 height=30 border=0></a>
<a href="#" onMouseover="wijzigbeeld('beeldplaatsing', 5)">
<img src="plaatjes van foto naar schilderij/bloem6.jpg" width= 40 height=30 border=0></a>
<a href="#" onMouseover="wijzigbeeld('beeldplaatsing', 6)">
<img src="plaatjes van foto naar schilderij/bloem7.jpg" width= 40 height=30 border=0></a>
<a href="#" onMouseover="wijzigbeeld('beeldplaatsing', 7)">
<img src="plaatjes van foto naar schilderij/bloem8.jpg" width= 40 height=30 border=0></a>
<a href="#" onMouseover="wijzigbeeld('beeldplaatsing', 8)">
<img src="plaatjes van foto naar schilderij/slak1.jpg" width= 40 height=30 border=0></a>
<a href="#" onMouseover="wijzigbeeld('beeldplaatsing', 9)">
<img src="plaatjes van foto naar schilderij/steiger1.jpg" width= 40 height=30 border=0></a>
<a href="#" onMouseover="wijzigbeeld('beeldplaatsing', 10)">
<img src="plaatjes van foto naar schilderij/steiger5classicround.jpg" width= 40 height=30 border=0></a>





</center>

<br><br><br><br>
<!-- Hoogte en breedte van deze DIV-tag instellen op de grootste afbeelding -->
<!-- Te plaatsen waar je wil dat de foto's verschijnen. -->
<center>
<div id="beeldplaatsing" style="width:80px;height:225px">
<image src="plaatjes van foto naar schilderij/bloem1.jpg" alt="foto 1">
</div>
</center>


</body>
</html>

Nogmaals dank!
 
Hoi clochard,
Als ik me niet vergis, komt dit script uit AnouksWeb: "Thumbnails met vervaging".
Ook het originele voorbeeld daar doet het niet goed:
  • De positie van de grote afbeelding staat alleen goed in Internet Explorer. In alle andere browsers (Firefox, Opera, Safari en Chrome) staan ze te rechts van het midden.
  • De vervaging (infaden) bij een plaatjeswissel doet het ook alleen in Internet Explorer.
  • Daarnaast worden afgekeurde html-tags zoals <center> gebruikt, worden voor de thumbnails dezelfde afbeeldingen als voor de grote gebruikt (d.w.z. eerst moet alles ingeladen zijn, wat vooral bij grote grote foto's een erg trage pagina maakt), en het script is ook nogal verouderd.
Kortom, geen handig ding.
Gelukkig zijn er vele betere alternatieven. Bijvoorbeeld:
Met vriendelijke groet,
CSShunter
 
plaatje centreren nu wel

Hallo csshunter,

sorry voor mijn late reaktie...

Ik heb e.e.a. aangepast zodat het plaatje wel mooi gecentreerd staat.
Het werkt dus allemaal maar...ik ben toch niet helemaal tevreden (zie fremdart.nl)
Zo krijg ik op kleinere monitoren (heb zelf een breedbeeld) niet alle afbeeldingen te zien en dergelijke zaken
De manieren om plaatjes te tonen die jij voorstelt zijn niet precies wat ik zoek...
Ze zijn wel mooi maar voor mijn smaak een beetje te gelikt (vind ik overigens ook va bv. simpleviewer).

Waar ik dus naar op zoek ga is een ander script. Mouseover wil ik er in ieder geval inhouden, allen wil ik de kleine plaatjes in tabellen gaan onderbrengen.
Ik zal me daarin eerst moeten gaan verdiepen, onervaren als ik ben:rolleyes:.
Het wordt vaak ook afgeraden, al weet ik niet wat nou precies de voors en tegens zijn van tabellen. Van css weet ik nog helemaal niets, dus, dat zal wel studeren worden.

Als je een goede tip hebt hoor ik dat natuurlijk graag.

In ieder geval erg bedankt voor je reaktie. Ik hoop hier nog veel op te steken van allerlei manieren betreffend het bouwen van een goede site:d
 
Status
Niet open voor verdere reacties.
                    Steun ons                    

Nieuwste berichten

Terug
Bovenaan Onderaan