Javascript werkt niet XHTML* - Softwareontwikkeling

donderdag 7 september 2006 11:12

Acties:

Topicstarter

Hallo, ik zit met het volgende probleem.

Ik ben bezig om een site volledig in xhtml en css te maken. Nu wil ik een scroll script van pijltjes. Dus je hebt een tekstvak, staat uiteraard tekst in en dan moet dan gaan scrollen door over de pijltjes heen te gaan.

Maar nu kom het volgende: Het script werkt, maar zodra ik bovenin de html pagina

code:

1	<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

neerzet, dan werkt het gelijk niet meer. Kan iemand mij vertellen hoe dit zit? hetzelfde geldt als ik er transitional er neer zet.

Hoop dat iemand mij kan helpen.

donderdag 7 september 2006 11:16

Acties:

SKiLLa

Byte or nibble a bit ?

Beetje googlen kan geen kwaad hoor; 1ste hit: http://www.html-site.nl/javascript-cdata.php ...

scheelt me weer typewerk

'Political Correctness is fascism pretending to be good manners.' - George Carlin

donderdag 7 september 2006 11:16

Acties:

BtM909

Watch out Guys...

Waarom wil je uberhaupt XHTML gebruiken, maar even los daarvan: ik denk dat jij wel even wat leesvoer kan gebruiken

[google=XHTML javascript doesn't work]

Ace of Base vs Charli XCX - All That She Boom Claps (RMT) | Clean Bandit vs Galantis - I'd Rather Be You (RMT)
You've moved up on my notch-list. You have 1 notch
I have a black belt in Kung Flu.

donderdag 7 september 2006 11:19

Acties:

damen18

Topicstarter

ok, dat was niet al te bijdehand...... bedankt voor de reacties. Dan gaan we door met html 4.

donderdag 7 september 2006 11:20

Acties:

BtM909

Watch out Guys...

HTML4 strict forceert je ook al netjes te werken... De voordelen die XHTML zou bieden, zal jij waarschijnlijk niet gebruiken.

Problem solved anyway

Ace of Base vs Charli XCX - All That She Boom Claps (RMT) | Clean Bandit vs Galantis - I'd Rather Be You (RMT)
You've moved up on my notch-list. You have 1 notch
I have a black belt in Kung Flu.

donderdag 7 september 2006 11:28

Acties:

damen18

Topicstarter

ik had de site zonder het javascript gedeelte xhtml strict gevalideerd. heb het laten valideren met http://validator.w3.org/ .toch is kijken voor een workaround, met html4 wilt het ook niet werken, heb een body onLoad staan.

donderdag 7 september 2006 11:31

Acties:

BtM909

Watch out Guys...

Laat dan eens een klein werkend voorbeeld zien, want zo gokken gaat je geen oplossingen geven

Ace of Base vs Charli XCX - All That She Boom Claps (RMT) | Clean Bandit vs Galantis - I'd Rather Be You (RMT)
You've moved up on my notch-list. You have 1 notch
I have a black belt in Kung Flu.

donderdag 7 september 2006 11:40

Acties:

damen18

Topicstarter

HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" >
<head>
    <title>test page</title>

<style type="text/css">  
#divUpControl{position:absolute; width:55%; left:0; top:0; z-index:1; text-align: right} 
#divDownControl{position:absolute; width:55%; left:0; top:55%; z-index:1; text-align: right} 
#divContainer{position:absolute; width:50%; height:50%; overflow:hidden; top:5%; left:2%; clip:rect(0,50%,50%,0); visibility:hidden} 
#divContent{position:absolute; top:0; left:0} 

</style>
<script language="JavaScript">

function verifyCompatibleBrowser(){ 
    this.ver=navigator.appVersion 
    this.dom=document.getElementById?1:0 
    this.ie5=(this.ver.indexOf("MSIE 5")>-1 && this.dom)?1:0; 
    this.ie4=(document.all && !this.dom)?1:0; 
    this.ns5=(this.dom && parseInt(this.ver) >= 5) ?1:0; 
 
    this.ns4=(document.layers && !this.dom)?1:0; 
    this.bw=(this.ie5 || this.ie4 || this.ns4 || this.ns5) 
    return this 
} 
bw=new verifyCompatibleBrowser() 
 
 
var speed=50 
 
var loop, timer 
 
function ConstructObject(obj,nest){ 
    nest=(!nest) ? '':'document.'+nest+'.' 
    this.el=bw.dom?document.getElementById(obj):bw.ie4?document.all[obj]:bw.ns4?eval(nest+'document.'+obj):0; 
    this.css=bw.dom?document.getElementById(obj).style:bw.ie4?document.all[obj].style:bw.ns4?eval(nest+'document.'+obj):0; 
    this.scrollHeight=bw.ns4?this.css.document.height:this.el.offsetHeight 
    this.clipHeight=bw.ns4?this.css.clip.height:this.el.offsetHeight 
    this.up=MoveAreaUp;this.down=MoveAreaDown; 
    this.MoveArea=MoveArea; this.x; this.y; 
    this.obj = obj + "Object" 
    eval(this.obj + "=this") 
    return this 
} 
function MoveArea(x,y){ 
    this.x=x;this.y=y 
    this.css.left=this.x 
    this.css.top=this.y 
} 
 
function MoveAreaDown(move){ 
    if(this.y>-this.scrollHeight+objContainer.clipHeight){ 
    this.MoveArea(0,this.y-move) 
    if(loop) setTimeout(this.obj+".down("+move+")",speed) 
    } 
} 
function MoveAreaUp(move){ 
    if(this.y<0){ 
    this.MoveArea(0,this.y-move) 
    if(loop) setTimeout(this.obj+".up("+move+")",speed) 
    } 
} 
 
function PerformScroll(speed){ 
    if(initialised){ 
        loop=true; 
        if(speed>0) objScroller.down(speed) 
        else objScroller.up(speed) 
    } 
} 
 
function CeaseScroll(){ 
    loop=false 
    if(timer) clearTimeout(timer) 
} 
var initialised; 
function InitialiseScrollableArea(){ 
    objContainer=new ConstructObject('divContainer') 
    objScroller=new ConstructObject('divContent','divContainer') 
    objScroller.MoveArea(0,0) 
    objContainer.css.visibility='visible' 
    initialised=true; 
} 

</script>
</head>

<body bgcolor="999999" onLoad="InitialiseScrollableArea()">

<div id="divUpControl"> 
    <a href="javascript:;" onMouseOver="PerformScroll(-7)" onMouseOut="CeaseScroll()">
    <img src="images/up.gif" /></a> 
</div>

<div id="divDownControl"> 
    <a href="javascript:;" onMouseOver="PerformScroll(7)" onMouseOut="CeaseScroll()">
    <img src="images/down.gif" /></a> 
</div>

<div id="divContainer"> 
    <div id="divContent"> 
        <b>Scroll Area Content Start</b> 
        <p> Lorem ipsum dolor sit amet, consectetur adipscing elit, sed diam nonnumy 
        eiusmod tempor incidunt ut labore et dolore magna aliquam erat volupat.</p>
        <p>Et harumd dereud facilis est er expedit distinct. Nam liber a tempor cum 
        soluta nobis eligend optio comque nihil quod a impedit anim id quod maxim 
        placeat facer possim omnis es voluptas assumenda est, omnis dolor repellend. 
        Temporem autem quinsud et aur office debit aut tum rerum necesit atib saepe 
        eveniet ut er repudiand sint et molestia non este recusand.</p>
        <p>Lorem ipsum dolor sit amet, consectetur adipscing elit, sed diam nonnumy 
        eiusmod tempor incidunt ut labore et dolore magna aliquam erat volupat.</p>
        <p>Et harumd dereud facilis est er expedit distinct. Nam liber a tempor cum 
        soluta nobis eligend optio comque nihil quod a impedit anim id quod maxim 
        placeat facer possim omnis es voluptas assumenda est, omnis dolor repellend. 
        Temporem autem quinsud et aur office debit aut tum rerum necesit atib saepe 
        eveniet ut er repudiand sint et molestia non este recusand.</p>
        <b>Scroll Area Content End</b><br /><br />
    </div>
</div>

hoe het nu staat werkt het niet, door dit

code:

1	<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

weg te halen wel.

als ik dit

code:

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

neer zet werkt het wel en aangezien ik toch geen xhtml nodig heb, laat ik het hier wel bij. Bedankt voor de moeite

[ Voor 1% gewijzigd door BtM909 op 07-09-2006 12:09 ]

donderdag 7 september 2006 11:44

Acties:

JayVee

shibby++!

Lees nog eens de tips die je hebt gekregen. Daar staat in waarom het weghalen van de DOCTYPE werkt.

En plaats je javascript in een apart bestand, dat kan dan lekker gecached worden door de browser (sneller en netter)!

ASCII stupid question, get a stupid ANSI!

donderdag 7 september 2006 11:50

Acties:

damen18

Topicstarter

die tips waren duidelijk, daarom gebruik ik nu ook geen xhtml meer, maar wilde het toch enigzins valideren. Bedankt voor de tip over het cachen.

donderdag 7 september 2006 12:01

Acties:

Rowanov

Kop eens wat anders...

Zowieso gebruik je een aantal dingen die enigszins achterhaald zijn; het b element zou je kunnen vervangen door een hx tag of desgewenst een span als je alleen een handvat voor styling nodig hebt.

Het language attribuut van het script element is deprecated in html 4.01. In plaats van language kan je type gebruiken. Je code komt er dan zo uit te zien:

HTML:

1	<script type="text/javascript">

Dit zal de validator zowieso wel aangeven.

De onLoad in je body kan je vermijden door in javascript iets als het volgende te doen:

JavaScript:

1	window.onload = InitialiseScrollableArea();

Je kan aan de window.onload ook direct een lijst met functies meegeven, zodat je initialise functie overbodig wordt:

JavaScript:

window.onload = function()
{
  // code die uitgevoerd moet worden
}

offtopic:
Als je [code=html] gebruikt voor je code-blokken, zie je een mooie highlighting waarbij de elementen en attributen die wegvallen in html 4.01 schuingedrukt weergegeven worden.

[ Voor 10% gewijzigd door Rowanov op 07-09-2006 12:03 ]

donderdag 7 september 2006 14:31

Acties:

damen18

Topicstarter

ok, dank je wel, vooral dat gedeelte over javascript heb ik wat aan. De tekst heb ik ff gekopieerd voor inhoud. Nu kan ik weer verder.

donderdag 7 september 2006 17:56

Acties:

Verwijderd

FWIW, die HTML4 DOCTYPE is achterhaald. Je hebt iets als:

code:

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

... nodig of als je het simpel wilt oplossen:

code:

1	<!doctype html>