De (voorlopige) OP van de [Javascript] voor dummies reeks.
Hier kan je alle vragen stellen over Javascript en alles wat er mee te maken heeft.
Heb je een probleem, post dan ook even de code waar het probleem zit
Zo kunnen we je beter proberen te helpen.Vorige delen:
#1 - [Javascript] voor dummies - Deel 1
#2 - [Javascript] voor dummies - Deel 2
#3 - [Javascript] voor dummies - deel 3
#4 - [Javascript] voor dummies - deel 4
#5 - [Javascript] voor dummies (deel 6)
#6 - [Javascript] voor dummies (deel 6)
#7 - [Javascript] voor dummies (deel 7)
Handige links:
Quircksmode Javascript
Javascript Cheat Sheet
Mis je een link? Geef even een gil in het topic
Tutorials:
W3Schools Javascript
W3Schools AJAX
Laatste posts uit het vorige topic:
quote:Op maandag 13 oktober 2008 18:48 schreef Flaccid het volgende:
Moet ie niet dicht en een nieuwe?
Deze OP: http://wiki.fok.nl/index.php/OP/Javascript
.ik heb voor google maps dit stukje script om een marker aan te maken
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 | function createMarker(point,html) { var marker = new GMarker(point); GEvent.addListener(marker,"click", function() { map.openInfoWindowHtml(point,html); }); return marker; } //<![CDATA[ var map = new GMap2(document.getElementById("map")); document.getElementById('map').style.backgroundColor = 'white'; var mapType = new GmapUploaderMapType(map, "http://mt.gmapuploader.com/tiles/fjn2OwJjRh", "jpg", 6); map.setCenter(new GLatLng(0,0), 5, mapType); map.addControl(new GLargeMapControl()); map.enableContinuousZoom(); GDownloadUrl("data.xml", function(data, responseCode) { var xml = GXml.parse(data); var markers = xml.documentElement.getElementsByTagName("marker"); for (var i = 0; i < markers.length; i++) { var point = new GLatLng(parseFloat(markers[i].getAttribute("lat")), parseFloat(markers[i].getAttribute("lng"))); var marker = createMarker(point,markers[i].getAttribute("content")); map.addOverlay(marker); } } ); //]]> </script> |
En dit in mijn data.xml
| 1 2 3 4 5 | <markers> <marker lat="4.19677734375" lng="1.1865234375" content="test"/> <marker lat="-1.40625" lng="-8.96484375" content="plas"/> </markers> |
Dat werkt allemaal, ik kan nu netjes markers aanmaken. Maar in de content kan ik geen html opmaak gebruiken. Het gaat dus niet om google maps maar om het xml en javascript gedeelte. Weet iemand hoe ik toch html kan gebruiken, het liefst een klein div/table erin kunnen pleuren met een titel en een fotootje.
Voorbeeld op www.jc-c.nl/mapfull.htm
quote:dankje O+
Wie kan me helpen? Wat komt er uit deze code?
| 1 2 3 4 5 | if(1<2){ document.write("tvp"); } </script> |
quote:tvp?Op maandag 13 oktober 2008 19:41 schreef PiRANiA het volgende:
[..]
dankje
Wie kan me helpen? Wat komt er uit deze code?
[ code verwijderd ]
quote:zou kunnen
quote:Maar dan zonder ?.
quote:1 is ALTIJD kleiner dan 2. Dus ja, er komt "tvp" uit.
quote:Ook in IE6?Op maandag 13 oktober 2008 20:28 schreef Jo0Lz het volgende:
[..]
1 is ALTIJD kleiner dan 2. Dus ja, er komt "tvp" uit.
Uit een bepaald form krijg ik deze data:
(-3.515625, -24.2578125)
Nu wil ik deze met een button press in 2 fields zetten, de linker waarde in de ene en de rechter waarde in de andere. dus zegmaar (a,b) word [a] en [b]. Is het moelijk ? hoe moet het?
quote:Nou ik krijg de value echt als (-3.515625, -24.2578125). Dus niet als a en b in een textbox. Dus,Op maandag 13 oktober 2008 22:02 schreef mcDavid het volgende:
document.getElementById("field1").value=a;
In dat geval zul je met de slice() functie je string in stukken moeten hakken. Je kunt bijv. met search() de positie van de haakjes en de komma achterhalen, en die posities in je slice functie gebruiken.
Ik ben op het moment bezig met een website en heb in Photoshop een menu gemaakt, dat geopend met fireworks en daar gesliced en een pop up menu aan gezet..
Nu heb ik dat geexporteerd en dan krijg ik een aantal bestanden..
In de preview van fireworks werkt alles naar behoren.
Maar hoe krijg ik nou dat menu in mijn html site, heb van alles geprobeerd maar krijg niks voor elkaar..
Als het menu opgeslagen is heb ik de volgende bestanden:
8 x gif file
1 x JScript script file
1 x CSS file
1 x html file
8 x MNO bestanden in een gecreerde _notes map
Iemand die weet wat ik waar moet zetten?
Ik ben hier bezig met een simpel accordion, alles werkt maar wil bij een hover de divs uitklappen. Hoe kan ik dat voor elkaar krjigen? Hier de minieme javascript:
http://www.spiderspider.n(...)ion/accordian-src.js
Accordion zelf:
http://www.spiderspider.n(...)accordion/Basic.html
quote:search and replace op "onclick" naar "onmouseover"?Op maandag 20 oktober 2008 @ 13:07 schreef emokid het volgende:
http://www.dezinerfolio.c(...)vascript-accordions/
Ik ben hier bezig met een simpel accordion, alles werkt maar wil bij een hover de divs uitklappen. Hoe kan ik dat voor elkaar krjigen? Hier de minieme javascript:
http://www.spiderspider.n(...)ion/accordian-src.js
Accordion zelf:
http://www.spiderspider.n(...)accordion/Basic.html
quote:het heeft niet zoveel met javascript te maken, meer met algemeen html, maargoed:Op zaterdag 18 oktober 2008 @ 20:56 schreef wc-eend het volgende:
Beste mensen,
Ik ben op het moment bezig met een website en heb in Photoshop een menu gemaakt, dat geopend met fireworks en daar gesliced en een pop up menu aan gezet..
Nu heb ik dat geexporteerd en dan krijg ik een aantal bestanden..
In de preview van fireworks werkt alles naar behoren.
Maar hoe krijg ik nou dat menu in mijn html site, heb van alles geprobeerd maar krijg niks voor elkaar..
Als het menu opgeslagen is heb ik de volgende bestanden:
8 x gif file
1 x JScript script file
1 x CSS file
1 x html file
8 x MNO bestanden in een gecreerde _notes map
Iemand die weet wat ik waar moet zetten?
Al die bestanden moet je natuurlijk uploaden.
De html-code zet je in de pagina op de plek waar je het menu wilt hebben
de css bestand include je in de <head> sectie met de volgende regel: <link rel="stylesheet" href="map/bestandsnaam.css" type="text/css" />
Het js-bestand moet denk ik ook in de head sectie. met de volgende regel:<script type="text/javascript" src="map/bestandsnaam.js"></script>
Als dat niet werkt, moet die laatste regel waarschijnlijk ergens onder de html van het menu...
de plaatjes moeten natuurlijk ook op de goeie locatie staan... wat die "MNO" bestanden zijn weet ik niet... is dat niet iets fotoshop-specifieks?
Tof!quote:ThanksOp maandag 20 oktober 2008 17:14 schreef mcDavid het volgende:
[..]
search and replace op "onclick" naar "onmouseover"?
[..]
het heeft niet zoveel met javascript te maken, meer met algemeen html, maargoed:
Al die bestanden moet je natuurlijk uploaden.
De html-code zet je in de pagina op de plek waar je het menu wilt hebben
de css bestand include je in de <head> sectie met de volgende regel: <link rel="stylesheet" href="map/bestandsnaam.css" type="text/css" />
Het js-bestand moet denk ik ook in de head sectie. met de volgende regel:<script type="text/javascript" src="map/bestandsnaam.js"></script>
Als dat niet werkt, moet die laatste regel waarschijnlijk ergens onder de html van het menu...
de plaatjes moeten natuurlijk ook op de goeie locatie staan... wat die "MNO" bestanden zijn weet ik niet... is dat niet iets fotoshop-specifieks?
Vraagje!
Van een plaatje pas ik de src aan met javascript (document.getelementbyid...etc). Dat plaatje moet laden, en wordt dan geplaatst. Kan ik op DAT laden al een eventlistener zetten, of moet ik iets als een loader oid aanmaken?
Tnx. Ik kan weer verder met m'n JS oefeningen
.| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 | <script type="text/javascript"> // _w : ID // _h : 'h' (=hide(verbergen)), of 's' (=show(tonen)) function wisselen(_w,_h) { if (document.all) { if (_h=='s') eval("document.all."+_w+".style.visibility='visible';"); if (_h=='h') eval("document.all."+_w+".style.visibility='hidden';"); } else { if (_h=='s') eval("document.layers['"+_w+"'].visibility='show';"); if (_h=='h') eval("document.layers['"+_w+"'].visibility='hide';"); } } </script> </head><body> <!-- Invoegen van het script gebeurt door toevoegen van onClick: --> <form> Tonen <input name="r1" type="radio" checked value="" onClick="wisselen('deel1','s')"> Verbergen <input name="r1" type="radio" value="" onClick="wisselen('deel1','h')"> </form> <form> Jaar <input name="t1" type="text"> <label> <input type="submit" name="b1" id="b1" value="Invoeren"> </label> </form> <!-- Het formuliergedeelte dat je wil tonen/verbergen plaats je tussen <span>-tags: --> <span id="deel1" style="visibility:visible;position:relative;top:0;left:0"> <form> Hier een te verbergen of te tonen tekst. </form> </span> <span id="deel2"> <!-- en hier wil ik graag de tekst van t1 hebben --> </span> </body></html> |
In een ander topic hoorde ik al:
"gewoon document.getElementById gebruiken ipv 'layers' of 'all' shizle. Weet niet waarom ze dat verzonnen hebt maar is nergens voor nodig in deze vorm."
en
"Ter aanvulling: en die eval() mag ook wel overal weg."
Ik ben nog een beginner op dit gebied en vroeg me af of iemand me hiermee kan helpen. Het liefst heb ik de uitvoer dan in een soort formulierveld. Net als bij Google maps dus eigenlijk als je een embed code opvraagt:
voorbeeld
Helaas werken bij google de pro's waar ik nog niet veel van snap :P
| 1 2 3 4 | if (_h == s) { document.getElementById(_w).disabled=true; } else { document.getElementById(_w).disabled=false; } } |
Dit is genoeg.
In plaats van .disabled=true kun je natuurlijk ook .style.visibility="hidden" of .style.display="none" gebruiken, net wat je wilt.
en lees hier verder: www.w3schools.com
vooral de stukken over DOM en Javascript zijn interessant hiervoor
[ Bericht 6% gewijzigd door mcDavid op 29-10-2008 15:26:10 (aangepast n.a.v. post superrembo) ]
Het lijtk me handiger om 2 functies te maken:
| 1 2 3 4 5 6 7 8 9 | { document.getElementById(id).style.display = ''; } function hide(id) { document.getElementById(id).style.display = 'none'; } |
Die kan je daarna gebruiken als onclick="show('deel1')". Je moet ook nog even style="visibility:visible;" vervangen door style="display:none".
quote:Hey, dankje! 't Werkt nu. Nu alleen nog even uitzoeken hoe ik een invoerveld ergens kan invoegen (zoals je merkt ben ik een aardige beginnerOp woensdag 29 oktober 2008 14:51 schreef SuperRembo het volgende:
Daar zitten nog fouten (foutjes) in. En 't is wat omslachtig.
Het lijtk me handiger om 2 functies te maken:
[ code verwijderd ]
Die kan je daarna gebruiken als onclick="show('deel1')". Je moet ook nog even style="visibility:visible;" vervangen door style="display:none".
) maar dat zal wel op die w3schools te vinden zijn..quote:godver je hebt gelijkOp woensdag 29 oktober 2008 @ 14:51 schreef SuperRembo het volgende:
Daar zitten nog fouten (foutjes) in. En 't is wat omslachtig.
Het lijtk me handiger om 2 functies te maken:
[ code verwijderd ]
Die kan je daarna gebruiken als onclick="show('deel1')". Je moet ook nog even style="visibility:visible;" vervangen door style="display:none".
stom!maarreuh; visibility en display zijn twee verschillende properties. Dus ligt aan de toepassing welke het handigst is. Ik denk voor de toepassing van TS dat disabled beter geschikt is.
quote:Dat is inderdaad verschillend. Meestal (naar mijn ervaring) wil je niet dat het verborgen element nog ruimte in neemt. Dan heb je dus display:none nodig en niet visibility:hidden. Alleen form elementen ondersteunen de enabled property (niet allemaal), en dan blijft het element ook zichtbaar. Het is de vraag of dat de bedoeling is.Op woensdag 29 oktober 2008 15:25 schreef mcDavid het volgende:
[..]
maarreuh; visibility en display zijn twee verschillende properties. Dus ligt aan de toepassing welke het handigst is. Ik denk voor de toepassing van TS dat disabled beter geschikt is.
quote:als het inderdaad een form betreft, is dat waarschijnlijk wel de bedoeling. Zie bijv. ook zijn voorbeeldlink van google maps waar dat gebeurt.
[..]
Dat is inderdaad verschillend. Meestal (naar mijn ervaring) wil je niet dat het verborgen element nog ruimte in neemt. Dan heb je dus display:none nodig en niet visibility:hidden. Alleen form elementen ondersteunen de enabled property (niet allemaal), en dan blijft het element ook zichtbaar. Het is de vraag of dat de bedoeling is.
Voordeel van visibiliyt ipv display is wel dat er geen verschuivingen optreden in de pagina als je de elementen weer zichtbaar maakt.
Stel ik heb de volgende lap HTML code
| 1 2 3 4 5 6 7 8 9 | <input type="checkbox" name="extra[opties_test2]" value="test2"> test 2<br /> <input type="checkbox" name="extra[opties_test3]" value="test3"> test 3<br /> <input type="radio" name="extra[opties_woei_1]" value="1">1<br /> <input type="radio" name="extra[opties_woei_2]" value="2">2<br /> <input type="radio" name="extra[opties_woei_3]" value="3">3<br /> <input type="text" name="extra[optie_info]" value="Hier je omschrijving"><br /> |
Hoe kun je middels javascript alle opties van extra uitlezen en in een tekst string zetten? de uitkomst wil ik zo ongv hebben
| 1 2 3 | opties_woei2 optie_info = 'tekst'; |
Kan iemand mij in de juiste richting duwen?
| 1 2 3 4 5 6 7 8 | var tekststring = "" for (var i=0; i < p.length; i++){ if(p[i].name.match("extra")) { tekststring += p[i].value + "\n" ; } } |
volgens mij zou zoiets moeten werken. weet niet zeker of p[i].name geldig is. En er zijn vast ook legio andere mogelijkheden.
www.w3schools.com
quote:Ik gebruik nu het scriptje van SuperRembo en wil daarmee graag het volgende: meerdere radiobuttons voor meerdere stukken tekst. Ik wil graag zoiets maken dat het show-script aanroept als een radio button geselecteerd is en het hide-script als het uit staat. Zoiets als het volgende dus (alleen je ziet'm vast al aankomen: dit werkt nog niet)Op woensdag 29 oktober 2008 14:51 schreef SuperRembo het volgende:
Daar zitten nog fouten (foutjes) in. En 't is wat omslachtig.
Het lijtk me handiger om 2 functies te maken:
[ code verwijderd ]
Die kan je daarna gebruiken als onclick="show('deel1')". Je moet ook nog even style="visibility:visible;" vervangen door style="display:none".
| 1 |
dan iets als
| 1 |
oh en met xhtml mag je geen shorttags gebruiken, dus in de xhtml checked="checked" gebruiken!
quote:getElementsByTagName() is niet handig, want dan krijg je alle elementen in plaats van alleen de form elementen.
[ code verwijderd ]
volgens mij zou zoiets moeten werken. weet niet zeker of p[i].name geldig is. En er zijn vast ook legio andere mogelijkheden.
| 1 2 3 4 5 6 | var fields = document.forms[0].elements; for (var i = ; i < fields.length; ++i) { if (fields[i].name.match(/^extra/)) info += fields[i].value + '\n'; } |
quote:Dan moet je op tagName en type controleren:
Super! ik ga het morgen even checken, is er ook een mogelijkheid om binnen javascript te checken of een bepaald element van een checkbox, radio oid afkomstig is?
| 1 |
quote:if (radio1.checked)
dus :P
quote:Ach, het zal toch niet om echt xhtml gaan. Dan zal alleen checked ook wel werken ;)oh en met xhtml mag je geen shorttags gebruiken, dus in de xhtml checked="checked" gebruiken!
quote:Hey het moet wel spannend blijven heh
[..]
getElementsByTagName() is niet handig, want dan krijg je alle elementen in plaats van alleen de form elementen.
[ code verwijderd ]
[..]
Dan moet je op tagName en type controleren:
[ code verwijderd ]
[..]
if (radio1.checked)
dus
[..]
Ach, het zal toch niet om echt xhtml gaan. Dan zal alleen checked ook wel werken
document.forms[0] is idd wel een ietsje nettere oplossing dan document.getElementById("[idvanhetform]")
En als het wel om 'echte' xhtml gaat zal het ook wel werken. Alleen gaat de W3C validator er dan wel van vloeken.
quote:Ik ga hier nog even op verder.<img onload...> is pas HTML5.0. 4.01 en XHTML1.0 vreten het niet. Weet je daar een oplossing voor?Op maandag 27 oktober 2008 01:16 schreef mcDavid het volgende:
Kan gewoon met onload.
Zelf de DTD aanpassen vind ik trouwens geen oplossing. Ik doel meer op een JS oplossing oid.
.
_Ik leer het wel, wedden?
Maar dat zou echt een gigantische kutoplossing zijn t.o.v. onload. En eentje die veel resources vraagt ook.
Ik zit te denken of het op een andere manier handig zou kunnen. Werkt onreadystatechange ook op plaatjes?
quote:Ah, zat ik dus al aardig in de buurt. Thnx!
Heb gezocht en niet gevonden, met PHP maak ik nu een simpele JSON array aan en wil deze middels XMLHTTP laden in een website.
Het script wat ik nu gebruik laat met een alert de opgehaalde content zien:
Voorbeeld:
| 1 |
Deze array wil ik graag gebruiken in javascript, maar heb werkelijk waar geen flauw idee hoe ik deze array kan benutten? het gaat mij alleen om de values en niets meer... anyone tips?
maar ik ben dan ook slecht in zoeken ik heb eval("var json = " + str); geprobeerd en dat werkte!!!
http://www.json.org/json2.js heeft dat risico niet.
quote:Iedere malloot kan met greasemonkey je javascriptjes aanpassen. Dus je gebruikt javascript sowieso niet voor dingen die enig risico met zich meebrengen.
Dat werkt wel, maar eval() heeft wel een risico dat er code uitgevoerd kan worden als iemand er in slaagt om de json string aan te passen.
http://www.json.org/json2.js heeft dat risico niet.
Dan maakt het ook niet uit hoe je met strings om gaat.
quote:Cross-site scripting enzo... Het probleem is niet dat ik scriptjes op mijn pc kan aanpassen zodat er dingen anders werken dan de websitebouwen bedoeld heeft. Wat wel een probleem is is dat de ene persoon de scripting bij een ander kan aanpassen. Okay, 't risico is waarschijnlijk niet vreselijk groot...Op maandag 3 november 2008 19:34 schreef mcDavid het volgende:
[..]
Iedere malloot kan met greasemonkey je javascriptjes aanpassen. Dus je gebruikt javascript sowieso niet voor dingen die enig risico met zich meebrengen.
Dan maakt het ook niet uit hoe je met strings om gaat.
Als je 't dan met eva wil doen, 't kan iets netter:
| 1 |
quote:Hier dan?Op dinsdag 4 november 2008 13:41 schreef donroyco het volgende:
Ik zoek een werkend Javascript waarmee je afbeeldingen kunt laten roteren met een fade-in en fade-out. Heb al gezocht, maar de meeste scripts via Google werken niet met fade-ins en fade-outs, of de sites zijn niet bereikbaar.. Alvast bedankt
quote:Thanks, daar kan ik zeker wat mee
Dit is briljant
ALS iets < 4 OF iets > 16 dan...
want OR blijkt niet te werken
-edit-
Ik moet || gebruiken
[ Bericht 22% gewijzigd door Chandler op 05-11-2008 11:22:54 ]
ik wil graag onderling afhankelijke dropdowmenu' s maken.
PHP levert een array met opties. Gelijk het aantal keys/opties wordt een overeenkomstig aantal dropdownmenu's weergegeven.
Ik wil het gebruiken voor een planningsmodule voor een band. Liedjes in volgorde zetten voor een setlijst.
Stel ik heb 10 liedjes. 10 arraykeys met value
PHP/javascript drukt een tabel af met nummers 1 tot en met 10.
Achter ieder nummer komt een dropdown met liedjes.
Selecteer ik bij nummer 1 een liedje, dan dient deze te verdwijnen uit de overige 9 dropdownmenu's. etc.
Ik wil graag weten of deze constructie ergens als codevoorbeeld te vinden is. (Zo ja, waar...?)
Ook zou ik graag willen weten hoe men deze functie noemt. Dan kan ik beter zoeken op het internet. Nu kan ik niets vinden.
Als ik codevoorbeelden heb kom ik er denk ik wel uit. Echt moeilijk is het niet volgens mij. Ik heb echter veel te weinig kaas van javascript gegeten om dit van 0 af op te bouwen.
Iemand aanwijzingen?
op www.w3schools.com vind je een hele hoop tutorials, staat vast wel wat nuttigs tussen!
Ik zou denk ik 2 arrays maken. 1 array voorgedefineerd met alle mogelijke opties.
Array 2 laat je aanmaken in een functie die je aanroept met onchange, en bestaat uit de values van alle selectboxes.
vervolgens vergelijk je de array en geef je de selectboxes die nog geen waarde hebben, de options mee die niet in array 2 voorkomen
Het makkelijkste is denk ik getElementsByTagName('select') als 2e array gebruiken...
stel ik wil een divje (400x400) centreren in mijn browser, echter ook als ik naar beneden scroll wil ik dat het divje in het midden van het scherm blijft. Hoe moet ik dit oplossen? ik weet hoe ik een div moet centreren met javascript maar niet als er gescrolled is ?
Ik heb het probleem ander sopgelost, heel anders. Ik wilde een array sorteren. Mijn constructie kon wel, maar was niet echt doodsimpel.
Een listbox met een up/down button wel.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 | <html> <head> <meta content="text/html; charset=UTF-8" http-equiv="content-type"> <title></title> <script language="JavaScript" src="http://www.mattkruse.com/javascript/selectbox/compact/selectbox.js"></script> <script type="text/javascript"> function selectAll(selectBox,selectAll) { // have we been passed an ID if (typeof selectBox == "string") { selectBox = document.getElementById(selectBox); } // is the select box a multiple select box? if (selectBox.type == "select-multiple") { for (var i = 0; i < selectBox.options.length; i++) { selectBox.options[i].selected = selectAll; } } } var el = function (id) { return document.getElementById(id); } function go(my) { var ind = el('select').selectedIndex; var L = el('select').options.length; el('select').selectedIndex = (my.value=="up" && ind > 0)? ind -1 my.value=="down" && ind < L-1)? ind +1 : (my.value=="to top")? 0 : (my.value=="to bottom")? L-1 : ind; var txt = el('select')[el('select').selectedIndex].innerHTML; el('select')[el('select').selectedIndex].innerHTML = el('select')[ind].innerHTML; el('select')[ind].innerHTML = txt; } </script> </head> <body> <?php if(isset($_POST)) { print_r($_POST); } ?> <form action="test.php" method="POST"> <SELECT NAME="updownlist[]" id="updownlist" SIZE="12" MULTIPLE> <OPTION VALUE="Option 1"> Option 1 <OPTION VALUE="Option 2"> Option 2 <OPTION VALUE="Option 3"> Option 3 <OPTION VALUE="Option 4"> Option 4 <OPTION VALUE="Option 5"> Option 5 <OPTION VALUE="Option 6"> Option 6 <OPTION VALUE="Option 7"> Option 7 <OPTION VALUE="Option 8"> Option 8 <OPTION VALUE="Option 9"> Option 9 <OPTION VALUE="Option 10"> Option 10 <OPTION VALUE="Option 11"> Option 11 <OPTION VALUE="Option 12"> Option 12 </SELECT> <INPUT TYPE="button" VALUE=" Up " onClick="moveOptionUp(this.form['updownlist'])"> <INPUT TYPE="button" VALUE="Down" onClick="moveOptionDown(this.form['updownlist'])"> <br /><input type="submit" name="submit" value="submit" onclick="selectAll('updownlist',true)"> </form> <br> </body> </html> |
quote:Ik zou kiezen voor een css-oplossing, met position: fixed;
Vraagje,
stel ik wil een divje (400x400) centreren in mijn browser, echter ook als ik naar beneden scroll wil ik dat het divje in het midden van het scherm blijft. Hoe moet ik dit oplossen? ik weet hoe ik een div moet centreren met javascript maar niet als er gescrolled is ?
Maar 'k weet niet in hoeverre dat cross-browser werkt (IE6). Hoewel, je krijgt het geheel dan niet midden in het scherm, maar wel altijd op dezeflde plek in het scherm.
Ook is het mijzelf niet gelukt
(moet gebruik maken van margin-left, top: etc)quote:breedte is niet zo lastig lijkt meOp woensdag 12 november 2008 @ 10:04 schreef Chandler het volgende:
Weet iemand trouwens een scriptje waarmee ik een div precies in het midden van het scherm kan zetten? had 1tje gevonden maar helaas deze werkt niet naar behoren en laat de div niet in het midden zien.
Ook is het mijzelf niet gelukt
hoogte:
| 1 2 3 4 5 6 7 | if (window.innerHeight) {var hoogte = window.innerHeight;} // voor firefox else if (document.body.clientHeight){var hoogte = document.body.clientHeight;} // voor IE div.height=200; // het is helaas noodzakelijk de hoogte in het DOM te defineren anders pakt'ie m niet if (((hoogte-div.height)/2) > 0){hoogte=(hoogte-div.height)/2;} else {hoogte = 0;} // anders verdwijnt je div als je schermhoogte lager dan de div is. div.style.top=hoogte+"px"; |
Werkt iig in IE en Fx. Voor IE moet je wel html {height:100%} in je css zetten.
De volgende functie(hieronder) moet het mogelijk maken om door op een knop te klikken, tekst te wijzigen, kleur wijzen en een andere functie aan mn button geven. Dit werkt in FF maar niet in IE, daar wordt de btn.onclick gelijk weer uitgevoerd en krijg ik een memory fout. Je kan geen setAttribute gebruiken voor IE, dit leek mij de enige mogelijkheid.. wat doe ik fout?
AJAX requests worden pas later toegevoegd uiteraard, het gaat alleen ff om dit stukje code..
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 | { var spanElement = document.getElementById(id) var btn = document.getElementById(btn); spanElement.innerHTML = "Uitgeschakeld." //IE if(navigator.appName == "Microsoft Internet Explorer") { spanElement.style.color = "red"; btn.value = "Inschakelen"; btn.onclick = setOn('berichtverkeer', 'berichtbtn'); } //Overige browsers else { spanElement.setAttribute("style","color:red;"); btn.setAttribute('onclick',"setOn('berichtverkeer','berichtbtn')"); btn.value = "Inschakelen"; } } function setOn(object, btn) { var spanElement = document.getElementById(object) var btn = document.getElementById(btn); if(navigator.appName == "Microsoft Internet Explorer") { spanElement.style.color = "green"; btn.value = "Uitschakelen"; btn.onclick = setOff('berichtverkeer', 'berichtbtn'); } else { spanElement.setAttribute("style","color:green;"); btn.setAttribute('onclick',"setOff('berichtverkeer','berichtbtn')"); btn.value = "Uitschakelen"; } spanElement.innerHTML = "Ingeschakeld." } |
| 1 2 3 | <br/> <input type="button" id="berichtbtn" onclick="setOff('berichtverkeer', 'berichtbtn')" value="Uitschakelen"> |
En volgens mij moet je de functie die je op onclick wilt zetten quoten. Dus:
btn.onclick='setOn(\'berichtverkeer\', \'berichtbtn\')'
quote:Door het te quoten werkt het helemaal niet meer.. maar ik vind het vreemd dat de onclick ook gelijk wordt uitegevoerd terwijl ik m alleen set.Op vrijdag 14 november 2008 13:52 schreef mcDavid het volgende:
Die functies die je voor IE gebruikt zouden het gewoon in alle brouwsers moeten doen hoor.
En volgens mij moet je de functie die je op onclick wilt zetten quoten. Dus:
btn.onclick='setOn('berichtverkeer', 'berichtbtn')'
| 1 |
bron
quote:btn.onclick= function(){ setOn('berichtverkeer', 'berichtbtn'); } werkt!
Ik dank je hartelijk
ik heb een divje (<div id="mainContent">)
en daarin staan diverse <span> elementen..
ik wil d.m.v. 1 onclick event alle span elementen verbergen en vervolgens 1 van die span's tonen (afhankelijk van het argument dat wordt mee gegeven)...
dit moet echter ook goed gaan wanneer alles al verborgen is (bij openen van de pagina)
de span's hebben als id:
vol1_C1
vol1_C2
vol1_C3
vol2_C1
vol2_C2
vol2_C3
etc...
hoe kan ik dat doen?
ik heb het volgende geprobeerd:
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 | { var allspans = mainContent.getElementsByTagName("span"); for (var i=0;i<allspans.length;i++) { for (var j=1;j<4;j++) { document.getElementById("vol" + i + "_C" + j).style.display = 'none'; document.getElementById("vol" + i + "_C" + j).style.visibility = 'hidden'; } } } function showhide2(id) { if(document.getElementById(id).style.display == 'none' || document.getElementById(id).style.display == '') { hideallids(); document.getElementById(id).style.visibility = 'visible'; document.getElementById(id).style.display = 'block'; } else { hideallids(); document.getElementById(id).style.visibility = 'hidden'; document.getElementById(id).style.display = 'none'; } } |
maar dat deed het niet (zowel FF als IE)
verder is volgens mij die 2e for loop dubbelop. Je kunt gewoon getElementsByTagName("span")[i].style.display='none' gebruiken.
En bovendien is visibility = hidden en display = none ook dubbelop.
Visibility zorgt ervoor dat een element onzichtbaar wordt, maar wel blijft staan;
display = none zorgt ervoor dat een element echt wordt 'weggehaald' (zodat'ie ook geen ruimte meer inneemt).
En tenslotte is een span van zichzelf display="inline" dus het lijkt me verstandig om inline te gebruiken ipv block (tenzij je er een goede reden voor hebt)
-edit-
overigens zijn je huidige for-loops sowieso verkeerd ingericht. Probeer maar eens voor jezelf na te gaan hoe er precies door de loops heengewandeld wordt (beetje lastig om het helemaal uit te leggen). Als je bovenstaande methode zou gebruiken zou het volgens mij wel goed gaan.
[ Bericht 18% gewijzigd door mcDavid op 15-11-2008 17:34:58 ]
quote:dat was inderdaad mijn probleemOp zaterdag 15 november 2008 17:28 schreef mcDavid het volgende:
Heb je mainContent wel gedefineerd als document.getElementById("mainContent")?
-knip-
en die 2de loop is niet dubbelop..
ik heb namelijk in de span 2 variabele nummers:
vol1_C1
het eerste cijfer geeft aan om welk "object" het gaat
en de 2de geeft aan om welk deel het van het "object" gaat
beide zijn variabel, echter heb ik de 2de een vast aantal gegeven... (omdat meer niet nodig is momenteel..)
en aangezien ik de gegevens los van elkaar wil benaderen heb ik deze oplossing bedacht, misschien niet de beste maar het functioneert precies zoals ik wil
ik kan overigens niet de span's aflopen om die per gevonden item te verbergen...
in de spans zitten nog wat spans (puur omdat het a) werkt en b) ik niks anders kon verzinnen
)| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 | { var element = document.getElementById("mainContent"); var allspans = element.getElementsByTagName("span"); for (var i=1;i<allspans.length/3;i++) { for (var j=1;j<4;j++) { var idname = "vol" + i + "_C" + j; document.getElementById(idname).style.display = 'none'; document.getElementById(idname).style.visibility = 'hidden'; } } } |
quote:mja die visibility/display is dan idd wel dubbelop... die corrigieer ik nog wel..En bovendien is visibility = hidden en display = none ook dubbelop.
Visibility zorgt ervoor dat een element onzichtbaar wordt, maar wel blijft staan;
display = none zorgt ervoor dat een element echt wordt 'weggehaald' (zodat'ie ook geen ruimte meer inneemt).
En tenslotte is een span van zichzelf display="inline" dus het lijkt me verstandig om inline te gebruiken ipv block (tenzij je er een goede reden voor hebt)
-edit-
overigens zijn je huidige for-loops sowieso verkeerd ingericht. Probeer maar eens voor jezelf na te gaan hoe er precies door de loops heengewandeld wordt (beetje lastig om het helemaal uit te leggen). Als je bovenstaande methode zou gebruiken zou het volgens mij wel goed gaan.
en hoe die gedisplayed wordt kan mij niet uitmaken als het werkt
(tis niet iets dat aan w3c moet voldoen, het moet goed functioneren.. en dat doet het in zowel IE als FF)En echt: display='none' en visibility = 'hidden' is dubbelop!
quote:hij pakt nu alleen de span's met een bepaalde ID, de rest laat hij lekker met rust (die IN de span met naam zitten)Op zaterdag 15 november 2008 20:19 schreef mcDavid het volgende:
ah, zo met allspans.length/3 klopt'ie al beter ja. Loopt je script er iig niet op vast. Maar als je functie er idd zo uitziet pakt'ie ze toch allemaal dus kun je net zo goed mijn idee gebruiken.
En echt: display='none' en visibility = 'hidden' is dubbelop!
Onderin dus een balk met thumbs, en als je aan de rand zit scroll je naar rechts of naar links. Op een klik op een thumb word er een nieuwe foto geladen, met een overgang (fadeinout). Net boven de balk komt een kleine textbalk, waar ik wat tekst wil op pleuren, gelinked per foto. Ik wil het helemaal zelf maken, is een goede oefening. Is dit haalbaar?
Tips?
Je kunt bijv. die grote afbeelding een ID geven, en dan de source wijzigen als je op een thumbnail klikt.
quote:Ik wil de onderste thumbbar als iframe doen. Of gewoon een ID met overflow scroll? Ik heb niks kunnen vinden btw over het scrollen met je muis aan de rand, kan iemand iets vinden? Ik wil eigenlijk aan de zijkanten nog iets doen met 2 knopjes [<<] img img img img [> >] en dat je scrollt als je op die pijltjes hovert.Op maandag 17 november 2008 14:17 schreef mcDavid het volgende:
Is prima haalbaar. Maar waarom wil je het met een iframe doen? maakt het alleen maar ingewikkeld denk ik.
Je kunt bijv. die grote afbeelding een ID geven, en dan de source wijzigen als je op een thumbnail klikt.
quote:Ik zou gewoon een div maken met overflow scroll idd.Op maandag 17 november 2008 @ 14:31 schreef Flaccid het volgende:
[..]
Ik wil de onderste thumbbar als iframe doen. Of gewoon een ID met overflow scroll? Ik heb niks kunnen vinden btw over het scrollen met je muis aan de rand, kan iemand iets vinden? Ik wil eigenlijk aan de zijkanten nog iets doen met 2 knopjes [<<] img img img img [> >] en dat je scrollt als je op die pijltjes hovert.
Verder ja met javascript kun je wel scrollen, dus moet te doen zijn met een hover...
zie bijv. http://www.w3schools.com/(...)_dom_window_scrollby
] op te halen.Voor firefox werkt het volgende prima:
| 1 |
IE heeft haar eigen alternatieve methode, maar die blijft maar 0 teruggeven.
| 1 |
Blijkbaar herkent'ie het wel, anders zou het script vastlopen of undefined teruggeven lijkt me..
Heeft iemand een idee?
quote:Hmm hoop interessant leesvoer!Op woensdag 19 november 2008 @ 16:40 schreef mschol het volgende:
http://episteme.arstechni(...)27813/m/147000393731 ?
Het blijkt idd alleen te werken met IE in quirks mode.
Maarja daar word je ook niet bepaald vrolijk van
| 1 2 | <iframe src="test.htm" height="250px" widht="100px" id="test" name="test" ></iframe> |
Dit werkt alleen niet.
[ Bericht 74% gewijzigd door Flaccid op 21-11-2008 14:49:47 ]
quote:maak 3 functies, functie 1: timer, functie 2: scrollBy() functie 3: kill timerOp vrijdag 21 november 2008 @ 14:25 schreef Flaccid het volgende:
Ik kom niet uit dat scrollen van een iframe (of id). Ik wil dat met 2 hovers kunnen doen.
onmouseover doe je functie 1,
onmouseout doe je functie 3.
de timer in functie 1 laat je bijv. iedere 100 ms functie 2 uitvoeren
functie 2 laat je iedere keer bijv. 3 pixels scrollen.
quote:Ik denk het wel, maar ik wil eerst kijken of ik het zelf kan.
http://www.java2s.com/Cod(...)ollwhenmouseover.htm is dit niet te gebruiken?
quote:Even scrollby ding opzoeken
[..]
maak 3 functies, functie 1: timer, functie 2: scrollBy() functie 3: kill timer
onmouseover doe je functie 1,
onmouseout doe je functie 3.
de timer in functie 1 laat je bijv. iedere 100 ms functie 2 uitvoeren
functie 2 laat je iedere keer bijv. 3 pixels scrollen.
Ik ben al een tijdje aan het klooien met het volgende: Ik probeer drie keer een cross fade effect te creëren met JS, dit lukt wel voor één array plaatjes. Maar de volgende twee willen niet lukken. Ik heb zitten kijken maar het komt omdat het script onder andere alleen de CSS id pakt en niet de class. Omdat getElementById bestaat, maar niet voor class...
Het huidige resultaat is hier te zien. De bedoeling is dat de eerste twee arrays hetzelfde als de derde array.
Mijn JS:
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 | var d=document, imgs = new Array(), zInterval = null, current=0, pause=false; function so_init() { if(!d.getElementById || !d.createElement)return; css = d.createElement("link"); css.setAttribute("href","./css/default.css"); css.setAttribute("rel","stylesheet"); css.setAttribute("type","text/css"); d.getElementsByTagName("head")[0].appendChild(css); imgs = d.getElementById("fade-one").getElementsByTagName("img"); for(i=1;i<imgs.length;i++) imgs[i].xOpacity = 0; imgs[0].style.display = "block"; imgs[0].xOpacity = .99; setTimeout(so_xfade,1000); } function so_xfade() { cOpacity = imgs[current].xOpacity; nIndex = imgs[current+1]?current+1:0; nOpacity = imgs[nIndex].xOpacity; cOpacity-=.05; nOpacity+=.05; imgs[nIndex].style.display = "block"; imgs[current].xOpacity = cOpacity; imgs[nIndex].xOpacity = nOpacity; setOpacity(imgs[current]); setOpacity(imgs[nIndex]); if(cOpacity<=0) { imgs[current].style.display = "none"; current = nIndex; setTimeout(so_xfade,1000); } else { setTimeout(so_xfade,50); } function setOpacity(obj) { if(obj.xOpacity>.99) { obj.xOpacity = .99; return; } obj.style.opacity = obj.xOpacity; obj.style.MozOpacity = obj.xOpacity; obj.style.filter = "alpha(opacity=" + (obj.xOpacity*100) + ")"; } } |
En mijn HTML:
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 | <tr> <td> <div id="fade-one"> <img src="image/1105969.jpg" alt="" /> <img src="image/1189632.jpg" alt="" /> <img src="image/1421495.jpg" alt="" /> <img src="image/1901696.jpg" alt="" /> <img src="image/2416070.jpg" alt="" /> <img src="image/3253313.jpg" alt="" /> <img src="image/3763733.jpg" alt="" /> </div> </td> <td class="seperator"></td> <td> <div id="fade-two"> <img src="image/3827955.jpg" alt="" /> <img src="image/3990747.jpg" alt="" /> <img src="image/4294622.jpg" alt="" /> <img src="image/5387336.jpg" alt="" /> <img src="image/5458789.jpg" alt="" /> <img src="image/5641430.jpg" alt="" /> <img src="image/5685370.jpg" alt="" /> </div> </td> <td class="seperator"></td> <td> <div id="fade-three"> <img src="image/5814188.jpg" alt="" /> <img src="image/5825672.jpg" alt="" /> <img src="image/5933698.jpg" alt="" /> <img src="image/6592410.jpg" alt="" /> <img src="image/7008812.jpg" alt="" /> <img src="image/7116237.jpg" alt="" /> </div> </td> </tr> </table> |
Iemand die weet hoe ik voor alle drie de arrays werkend kan krijgen?
| 1 2 3 4 5 6 | for(i=1;i<imgs.length;i++) imgs[i].xOpacity = 0; imgs[0].style.display = "block"; imgs[0].xOpacity = .99; setTimeout(so_xfade,1000); |
dat stukje 3x uitvoeren, en imgs niet global declareren maar meegeven in de functie.
quote:Ik ben echt een totale noob op het gebied van JS, zou je het misschien meer in jip-en-janneke taal kunnen uitleggenOp zondag 23 november 2008 21:51 schreef mcDavid het volgende:
[ code verwijderd ]
dat stukje 3x uitvoeren, en imgs niet global declareren maar meegeven in de functie.
? Ik zou echt niet weten hoe ik jou tips zou moeten verwerken...| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 | { str = ""; var done = new Array(); for (var i = 0; i < navigator.plugins.length; i++) { if (!done[navigator.plugins[i].name]) { done[navigator.plugins[i].name] = 1; str += escape(navigator.plugins[i].name) + ","; } } return str; } function gfxS_jsVersion() { js_ver = '0'; ar = new Array("1.0", "1.1", "1.2", "1.3", "1.4", "1.5", "1.6", "1.7", "1.8", "1.9", "2.0"); for (x = 0; x < ar.length; x++) { document.write('<' + 'script language="Javascript' + ar[x] + '">'); document.write('js_ver = "' + ar[x] + '";'); document.write('<' + '/script>'); } return js_ver; } function gfxS_checkCookie() { // create a fake cookie document.cookie = "testcookie=true"; if (document.cookie.indexOf('testcookie') == -1) { return 0; } else { return 1; } } var count_res = new Array(); count_res['language'] = navigator.language? navigator.language : navigator.userLanguage; count_res['colordepth'] = (navigator.appName.indexOf("Microsoft") > -1) ? screen.colorDepth : screen.pixelDepth; count_res['screenwidth'] = screen.width; count_res['screenheight'] = screen.height; count_res['referer'] = (document.referrer && document.referrer != "" && document.referer != 'undefined' && document.referrer != null) ? escape(document.referrer) : ''; count_res['is_java'] = (navigator.javaEnabled() == 1) ? 1 : 0; count_res['is_font'] = (window.screen.fontSmoothingEnabled == true) ? 1 : 0; count_res['is_cookie'] = gfxS_checkCookie(); count_res['js_version'] = gfxS_jsVersion(); count_res['plugins'] = gfxS_browserPlugins(); // do code var str = ''; var d = ''; for (var d in count_res) { if (count_res[d] != '') { str += "&" + d + "=" + count_res[d]; } } document.write('<img src="http://www.mijndomein.nl/count/<?php echo $_GET['id']; ?>.png?cache=false' + str + '" ALT="statistics"'); |
Als ik dit gebruik op een domein met de volgende externe librarys
<script type="text/javascript" src="js/prototype.js"></script>
<script type="text/javascript" src="js/scriptaculous.js?load=effects,builder"></script>
<script type="text/javascript" src="js/lightbox.js"></script>
dan krijg ik een fout
| 1 |  ? this.length : (i < 0 ? this.length + i : i) + 1; var n = this.slice(0, i).reverse().indexOf(item); return (n < 0) ? n : i - n - 1;}&indexOf=function(item, i) { i || (i = 0); var length = this.length; if (i < 0) i = length + i; for (; i < length; i++) if (this[i] === item) return i; return -1;}&toJSON=function() { var results = []; this.each(function(object) { var value = Object.toJSON(object); if (!Object.isUndefined(value)) results.push(value); }); return '[' + results.join(', ') + ']'; }&clone=function() { return [].concat(this); }&intersect=function(array) { return this.uniq().findAll(function(item) { return array.detect(function(value) { return item === value }); }); }&uniq=function(sorted) { return this.inject([], function(array, value, index) { if (0 == index || (sorted ? array.last() != value : !array.include(value))) array.push(value); return array; }); }&reduce=function() { return this.length > 1 ? this : this[0]; }&without=function() { var values = $A(arguments); return this.select(function(value) { return !values.include(value); }); }&flatten=function() { return this.inject([], function(array, value) { return array.concat(Object.isArray(value) ? value.flatten() : [value]); }); }&compact=function() { return this.select(function(value) { return value != null; }); }&last=function() { return this[this.length - 1]; }&first=function() { return this[0]; }&clear=function() { this.length = 0; return this; }&_each=function(iterator) { for (var i = 0, length = this.length; i < length; i++) iterator(this[i]); }&_reverse=function reverse() { [native code]}&some=function(iterator, context) { iterator = iterator ? iterator.bind(context) : Prototype.K; var result = false; this.each(function(value, index) { if (result = !!iterator(value, index)) throw $break; }); return result; }&every=function(iterator, context) { iterator = iterator ? iterator.bind(context) : Prototype.K; var result = true; this.each(function(value, index) { result = result && !!iterator(value, index); if (!result) throw $break; }); return result; }&entries=function() { return this.map(); }&member=function(object) { if (Object.isFunction(this.indexOf)) if (this.indexOf(object) != -1) return true; var found = false; this.each(function(value) { if (value == object) { found = true; throw $break; } }); return found; }&filter=function(iterator, context) { iterator = iterator.bind(context); var results = []; this.each(function(value, index) { if (iterator(value, index)) results.push(value); }); return results; }&select=function(iterator, context) { iterator = iterator.bind(context); var results = []; this.each(function(value, index) { if (iterator(value, index)) results.push(value); }); return results; }&find=function(iterator, context) { iterator = iterator.bind(context); var result; this.each(function(value, index) { if (iterator(value, index)) { result = value; throw $break; } }); return result; }&map=function(iterator, context) { iterator = iterator ? iterator.bind(context) : Prototype.K; var results = []; this.each(function(value, index) { results.push(iterator(value, index)); }); return results; }&inspect=function() { return '[' + this.map(Object.inspect).join(', ') + ']'; }&size=function() { return this.length; }&zip=function() { var iterator = Prototype.K, args = $A(arguments); if (Object.isFunction(args.last())) iterator = args.pop(); var collections = [this].concat(args).map($A); return this.map(function(value, index) { return ite |
terwijl ik eingelijk dit terug zou moeten krijgen
| 1 |
Wat gaat er fout? :D kan iemand mij hiermee helpen?
Dit kan je "oplossen" door de omslachtige prototypejs functies te gebruiken. Of je kan een alternatief voor for( in ) bedenken.
Of je kan prototypejs natuurlijk helemaal over boord gooien
2. Het alternatief voor for(x in y) met prototypejs is Enumerable.each(), zie api
3. Jouw for(x in y) levert niet op wat je verwacht omdat je langs alle properties van het object loopt. Dus niet alleen de property's die jij hebt gezet, maar ook de property's die prototypejs heeft toegevoegd (zoals een functie indexOf)
4. In jouw geval kan je de querystring ook opbouwen zonder for loopje, gewoon direct de string aan elkaar plakken.
Als je prototypejs wil blijven gebruiken dan kan je ook een Hash object gebruiken, die heeft een toQueryString functie.
maar idd dan zal ik het even moeten herschrijven zonder for ... in[ Bericht 94% gewijzigd door Flaccid op 02-12-2008 20:24:32 ]
Ik heb een ajaxcall nadat er een bepaalde sleutel in een textveld is ingevoerd. Maar dit kan ook dmv plakken.
Ik had het onkeyup event en dat werkt uiteraard prima zolang je maar met het keyboard plakt en niet met de muis. onmouseup toegevoegd maar die fired alleen op de LINKER muisknop en rechtsklikken voor het contextmenu en dan plakken wordt niet op gereageerd. Toen vond ik het 'onpaste' event, maar die reageert alleen op een ctrl-v en niet op een rechtermuisknop -> plak.
Iemand een idee?
event.which==2
event.button==2 //alto-manier voor de alto-browser IE
Ander probleem. IE7 geeft een JS error zodra ik op 'bekijk' klik en ik heb geen idee waarom...
| 1 2 3 4 5 | <img src="../images/yes.gif" height="10px" width="10px" /> Geldige coupon!<br /> <span style="color:black;cursor:pointer;cursor:hand;text-decoration:underline" onclick="window.open('http://www.domein.nl/pagina.php','Overzicht winkelwagentje','width=650,height=125,left=200,top=0,scrollbars=no');"> Bekijk</span> uw bijgewerkte winkelwagentje.</td> |
De foutmelding is 'invalid argument' char 1 op deze regel...
Ik heb nu voor de leesbaarheid even linebreaks toegevoegd. in de source staat het op 1 regel. IN safari en ff op OSX en chrome windows opent de pop-up window prima.
quote:'Overzicht winkelwagentje' moet aan elkaar (het is geen titel die getoond wordt, allleen een naam om het venster later aan te kunnen spreken via JS)Op zaterdag 6 december 2008 21:46 schreef Swetsenegger het volgende:
Ik heb het opgelost. onpaste werkt wel, maar direct als je op 'paste' drukt. En dan staat simpelweg de waarde die je wil pasten nog niet in je input veld. Dus een settimeout lostte het probleem op.
Ander probleem. IE7 geeft een JS error zodra ik op 'bekijk' klik en ik heb geen idee waarom...
[ code verwijderd ]
De foutmelding is 'invalid argument' char 1 op deze regel...
Ik heb nu voor de leesbaarheid even linebreaks toegevoegd. in de source staat het op 1 regel. IN safari en ff op OSX en chrome windows opent de pop-up window prima.
quote:
[..]
'Overzicht winkelwagentje' moet aan elkaar (het is geen titel die getoond wordt, allleen een naam om het venster later aan te kunnen spreken via JS)
Bizar dat alleen IE daarover valt. En ik had hem in mijn ajaxcall al een keer gewijzigd, maar als ik de page refreshed kijkt hij of ik een sessie korting heb en zo ja, veranderd hij gewoon de innerhtml serverside. Dus clientside wel aangepast, serverside niet waardoor ik geen resultaat dacht te hebben.
| 1 2 3 4 5 6 7 | <input type="text" name="titel[2]" tabindex="2" value="tekst hier"> <input type="checkbox" name="check[2]" value="2" tabindex="101"><br /> <input type="text" name="titel[3]" tabindex="3" value="weer iets anders"> <input type="checkbox" name="check[3]" value="3" tabindex="102"><br /> <input type="text" name="titel[4]" tabindex="4" value="hold on"> <input type="checkbox" name="check[4]" value="4" tabindex="103"><br /> |
Nu wil ik dat wanneer de inhoudt gewijzigd wordt de checkbox aangevinkt wordt. Op zich is dat natuurlijk niet zo moeilijk en dat klopt, maar eingelijk wil ik ook controlleren dat wanneer iemand de tekst niet veranderd de checkbox niet gechecked wordt... een beetje extra controle.
Heeft iemand een idee hoe ik dit het beste kan controlleren?
| 1 2 3 4 5 6 7 8 9 10 11 12 | imgTitleArr = new Array(); function imgTitle(id) { if (!imgTitleArr[id]) { imgTitleArr[id] = document.getElementById('img_' + id).value; } document.getElementById('check_' + (id+999)).checked = ((imgTitleArr[id] != document.getElementById('img_' + id).value) ? true : false); } </script> |
En dit is de code voor het bewerken van de titel van de afbeelding
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 | <div class="box"><img src="thumbnail/2008/12/09/1-1228817838-706146240.jpg" alt="image" /></div> <span>Titel</span> <input type="text" onKeyUp="imgTitle(0);" id="img_0" name="img_tit[1]" tabindex="99" value="" /><br /> <span>Map </span> Hoofdmap<br /> <span>Views</span> 5 <br /><br /> <span>Opties</span> <input type="checkbox" id="check_999" tabindex="999" style="width: 20px; margin-right: 2px; float: left;" name="check[1]" /> <a href="/image/1.html"><img src="/images/icon_view.gif" alt="Bekijk" /></a> <a href="/photoedit.html?id=1"><img src="/images/icon_edit.gif" alt="Bewerk" /></a> <br /> </div> <div> <div class="box"><img src="thumbnail/2008/12/09/1-1228817838-674804687.jpg" alt="image" /></div> <span>Titel</span> <input type="text" onKeyUp="imgTitle(1);" id="img_1" name="img_tit[2]" tabindex="100" value="" /><br /> <span>Map </span> Hoofdmap<br /> <span>Views</span> 0 <br /><br /> <span>Opties</span> <input type="checkbox" id="check_1000" tabindex="1000" style="width: 20px; margin-right: 2px; float: left;" name="check[2]" /> <a href="/image/2.html"><img src="/images/icon_view.gif" alt="Bekijk" /></a> <a href="/photoedit.html?id=2"><img src="/images/icon_edit.gif" alt="Bewerk" /></a> <br /> </div> |
Op zich werkt het al aardig, maar als ik niets in de input field heb staan en er iets in zet en het weer weghaalt blijft de checkbox gevinkt staan en dat wil ik niet. Ik wil controlleren of imgTitleArr[id] bestaat of niet en dat werkt blijkbaar niet goed met if (!imgTitleArr[id])
Anyone? :D
en uitbeelden al helemaal niet maar we proberen het even opnieuw.Het probleem is als volgt. Zoals je in de vorige post van mij kan zien heb ik een aantal input velden, deze input velden worden bij de eerste klik (op het veld zelf) gecontrolleerd door een stukje javascript. Dit stukje javascript dient te controlleren of de input is veranderd of niet. Waarbij het bij de 1e klik kijkt of er in een array de ID van het input veld te vinden is, is dit niet het geval dan moet de index in de array aangemaakt worden met de huidige waarde van het input veld. Is de tekst veranderd dan dient de checkbox aangevinkt te worden (automatisch)
Nu werkt het deels, echter als de input veld leeg is en ik er een tekst in zet en deze tekst weer verwijder krijg blijft de checkbox gevinkt, dat is mijn probleem. Waarschijnlijk ligt het probleem bij het aanmaken van het element in de array. Want blijkbaar ziet !arr[id] een lege variabel ook als 'niets' en dat is niet de bedoeling.
Hoe kan ik dit oplossen? (is dit beter?
)Het rare is dat wanneer de tekstveld leeg is en ik bv 1x een a invoer de checkbox niet gechecked wordt, maar doe ik 2x een a dan wordt de checkbox gevinkt, haal ik alles weg dan blijft de checkbox gevinkt tenzij ik 1 a laat staan dan is de checkbox niet gevinkt!
[ Bericht 2% gewijzigd door Chandler op 10-12-2008 11:15:06 ]
Alleen weet ik echt niet hoe je het volgende zou moeten doen:
Je hebt een variabele (een jaartal, dus 4 cijfers).
Het scriptje moet die variabele in tweeën splitsen als het ware en er twee andere (of één andere
) variabele(n) van maken.Voorbeeld:
Iemand voert 2008 als jaartal in.
Het scriptje hakt dit vervolgens in tweeën en maakt er twee variabelen van, zoals:
variabele1=20
variabele2=08
Ik heb keine idee
| 1 2 3 4 5 6 7 | var month = 11; var d = 1; var date = new Date(year, month - 1, d);// een Date object var day = date.getDay();// dag van vandaag, 0=zondag, 1=maandag var dayNames = ['zo', 'ma', 'di', 'wo', 'do', 'vr', 'za']; alert(dayNames[day]);// geeft de naam van de datum |
Maar waarom zou je het jaartal in tweeën willen hakken?
quote:Op donderdag 11 december 2008 @ 13:53 schreef Scorpie het volgende:
Ik heb een textfield waarop ik events capture. Control+v (pasten) werkt, die kan ik opvangen. Maar rechtermuis knop in het textfield en dan paste werkt niet. Iemand een idee hoe ik dit event capture?
! stop er maar mee, swets is je voor op deze opdracht! quote:Op zaterdag 6 december 2008 @ 21:46 schreef Swetsenegger het volgende:
Ik heb het opgelost. onpaste werkt wel, maar direct als je op 'paste' drukt. En dan staat simpelweg de waarde die je wil pasten nog niet in je input veld. Dus een settimeout lostte het probleem op.
quote:Op donderdag 11 december 2008 13:57 schreef mcDavid het volgende:
[..]
[..]
! Swets post je ajax call code eens!
quote:Ja, zo kan het natuurlijk ook.Op donderdag 11 december 2008 10:40 schreef SuperRembo het volgende:
[ code verwijderd ]
Maar waarom zou je het jaartal in tweeën willen hakken?
Maar ik ben beginner met JS en moet opdrachten maken voor studie. Ik heb dus een pseudocode gekregen en moet die omzetten in JS.
Met PSD's jeweetwel een Nassi Scheinderman Diagram
(lol wie gebruikt die nog, onze school wel 
) is het supersimpel eigenlijk en weet ik het zo te doen, maar met JS dus helaas niet.Laat ik mijn vraag even anders formuleren dan:
a. Ik heb dus 1 variabele te weten een jaartal van 4 cijfers.
b. Met een of andere command/code moet hij dit getal in tweeën hakken.
c. Vervolgens moet hij hiervan 2 variabelen maken.
Dus:
a. invoer bijv. 2008
b. wil ik nu juist weten, zodat je 20 en 08 krijgt.
c. dat zal lukken als ik b weet, zodat variabele 1=20 en variabele 2=08
Hoop echt dat iemand me kan helpen.
En nog een kort beginners vraagje:
Waarom zetten mensen soms var voor een variabele? Dat is toch eigenlijk niet nodig? Of is dit weer voor oudere browsers
quote:vraag 1: variable_1=jaartal.slice(0,2); variable_2=jaartal.slice(2,4)Op donderdag 11 december 2008 @ 17:38 schreef SunBoom het volgende:
[..]
Ja, zo kan het natuurlijk ook.
Maar ik ben beginner met JS en moet opdrachten maken voor studie. Ik heb dus een pseudocode gekregen en moet die omzetten in JS.
Met PSD's jeweetwel een Nassi Scheinderman Diagram
Laat ik mijn vraag even anders formuleren dan:
a. Ik heb dus 1 variabele te weten een jaartal van 4 cijfers.
b. Met een of andere command/code moet hij dit getal in tweeën hakken.
c. Vervolgens moet hij hiervan 2 variabelen maken.
Dus:
a. invoer bijv. 2008
b. wil ik nu juist weten, zodat je 20 en 08 krijgt.
c. dat zal lukken als ik b weet, zodat variabele 1=20 en variabele 2=08
Hoop echt dat iemand me kan helpen.
En nog een kort beginners vraagje:
Waarom zetten mensen soms var voor een variabele? Dat is toch eigenlijk niet nodig? Of is dit weer voor oudere browsers
vraag 2: je moet ze één keer declareren met var, daarna is het lang leve de lol.
-edit- Ok, je mág ze declareren, kan nuttig zijn als je met functions werkt.
Nu heb ik een ander klein vaag iets.
In internet explorer gebeurd er niets met onmouseout maar in firefox wel.
Ik heb de volgende functie gemaakt:
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 | { star = ''; for (x = 1; x < 6; x++) { if (vote != -1) { s = (x <= vote) ? '_yellow' : '_gray'; } else { s = (x < num) ? '_yellow' : '_gray'; } star += '<a href="/rate.php?id=' + id + '&vote=' + x + '" TITLE="Stem ' + x + ' sterren"><img onmouseover="stars(' + num + ',' + id + ',' + x + ');" onmouseout="stars(' + num + ',' + id + ',-1);" src="/images/star' + s + '.gif" ALT="Stem ster ' + x + '" /></a>'; } document.getElementById('votediv').innerHTML = star; } |
en dit gebruik in het volgende stukje html
| 1 2 | <script type="text/javascript">stars(4, 1, -1);</script> |
echter in FF krijg ik weer de standaard aantal stemmen terug bij een onmouseout maar in IE blijft het aantal stemmen staan op de stem(aantal sterren) die het laatst getriggerd is door een onmouseover
Doe ik iets fout? of zit Internet Explorer weer te ouhoeren?
Kun je niet beter een voting script met PHP maken?
Verder wordt het voten verder geregeld via PHP, maar dat is de vraag niet
hoe verneuk ik de gehele layout ? hier ziet het er allemaal netjes uit hoor! IE7
quote:Welke error krijg je? Zeldzaam ranzige JS overigens, om zo met die HTML string te kloten. DOM-scripting en event listeners anyone?Op vrijdag 12 december 2008 18:33 schreef Chandler het volgende:
Doe ik iets fout? of zit Internet Explorer weer te ouhoeren?
Ik heb een verzoekje/vraagje. Ik ben bezig een site in elkaar te knutselen in dreamweaver (neej, ben niet al te handig, kom niet verder dan iets simpels...) en wil graag zo'n random image. Dat wanneer je refresht je een nieuwe image te zien krijgt.
Die zou dan in de header moeten komen te staan. Heb gisteren de hele dag gezocht op internet, ook wat scripts gevonden, maar wat ik ook deed, ik kreeg geen foto te zien. Nu ben ik op het gebied van Javascript een complete leek, dus ik zal wel iets heel simpels fout doen, maar ik weet niet wat
Ik heb 10 plaatjes geselecteerd. Allen zijn 1288x300. En ik zou die dus graag random als header gebruiken...
Heeft iemand een simpele code die ik kan toepassen?
Alvast ontzettend bedankt!
quote:Ik krijg totaal geen errors, in IE niet maar ook in FF geen errors. En het zal ongetwijfeld ranzig zijn
Welke error krijg je? Zeldzaam ranzige JS overigens, om zo met die HTML string te kloten. DOM-scripting en event listeners anyone?
maar heel veel meer kaas heb ik niet van javascript gegeten (misschien handig om eens wat meer te leren over het aanmaken van elementen etc).Wat bedoel je precies met dom-scripting en event listeners?
zodat ik er van kan leren
quote:Gewoon een random hit @ GoogleOp zondag 14 december 2008 12:57 schreef Relin het volgende:
Hey,
Ik heb een verzoekje/vraagje. Ik ben bezig een site in elkaar te knutselen in dreamweaver (neej, ben niet al te handig, kom niet verder dan iets simpels...) en wil graag zo'n random image. Dat wanneer je refresht je een nieuwe image te zien krijgt.
Die zou dan in de header moeten komen te staan. Heb gisteren de hele dag gezocht op internet, ook wat scripts gevonden, maar wat ik ook deed, ik kreeg geen foto te zien. Nu ben ik op het gebied van Javascript een complete leek, dus ik zal wel iets heel simpels fout doen, maar ik weet niet wat
Ik heb 10 plaatjes geselecteerd. Allen zijn 1288x300. En ik zou die dus graag random als header gebruiken...
Heeft iemand een simpele code die ik kan toepassen?
Alvast ontzettend bedankt!
... quote:Is het wat gelukt met het script dat SunBoom heeft gevonden? En zo niet, wat heb je dan aan code? Overigens zou ik het met php doen, maar javascript is natuurlijk ook een optie.
FYI, ik ben bekend met Google, had je kunnen lezen, maar niet met Javascript. Vandaar dus ook mijn vraag hier, want ik heb verschillende scripts uitgeprobeerd, maar schijnbaar werkt het niet
Even los van een random afbeelding, ik vind een header van 1288 pixels nogal breed.
En ik weet dat 1288 groot is, maar ik wilde de header over de hele breedte van de pagina en ik gebruik zelf 1280x1024
Voor PHP moet je site dat toch ondersteunen ofzo? Ik weet niet of de mijne dat doet. Die wordt door One gehost. Is PHP eenvoudiger dan?
quote:One ondersteunt dat.
Nee, is niet gelukt. Krijg links bovenin een kruisje... Of moet ik eerst de foto's uploaden via FTP (nieuwe pagina staat nog niet online nl. Bekijk hem steeds offline) Sorry als het een domme vraag is
En ik weet dat 1288 groot is, maar ik wilde de header over de hele breedte van de pagina en ik gebruik zelf 1280x1024
Voor PHP moet je site dat toch ondersteunen ofzo? Ik weet niet of de mijne dat doet. Die wordt door One gehost. Is PHP eenvoudiger dan?
Hernoem je bestand naar bestandsnaam.php en zet daar eens in:
<img src="<?=rand(0,4)?>.jpg">
waar je je plaatjes 0.jpg, 1.jpg, 2.jpg, 3.jpg en 4.jpg noemt.
quote:in dat geval is 1288 weer erg smal, zat mensen browsen breder.Op maandag 15 december 2008 @ 16:34 schreef Relin het volgende:
Nee, is niet gelukt. Krijg links bovenin een kruisje... Of moet ik eerst de foto's uploaden via FTP (nieuwe pagina staat nog niet online nl. Bekijk hem steeds offline) Sorry als het een domme vraag is
En ik weet dat 1288 groot is, maar ik wilde de header over de hele breedte van de pagina en ik gebruik zelf 1280x1024
Voor PHP moet je site dat toch ondersteunen ofzo? Ik weet niet of de mijne dat doet. Die wordt door One gehost. Is PHP eenvoudiger dan?
quote:Neem eerst even een cursus HTML.Op maandag 15 december 2008 16:34 schreef Relin het volgende:
Nee, is niet gelukt. Krijg links bovenin een kruisje...
quote:Op een scherm met een resolutie van 1280? Daar zie ik nog niet zoveel mensen browsen op 1288
[..]
in dat geval is 1288 weer erg smal, zat mensen browsen breder.
quote:
[..]
Op een scherm met een resolutie van 1280? Daar zie ik nog niet zoveel mensen browsen op 1288
Iig thanks voor de hulp!
Ik heb in de database een aantal categorieën & subcategorieën staan. Bij het aanmaken van een object kan men eerst de categorie selecteren. Hierna wil ik dat in een tweede selectbox de subcategorieën die bij die categorie horen, komen.
Nu heb ik een tijdje lopen googelen maar niet echt het antwoord kunnen vinden (zo moeilijk moet het toch niet zijn?)
Iemand hier een ideetje?
quote:Euh, je bent nogal vaag... de gebruiker krijgt een pagina met een selectbox, en afhankelijk van zijn keuze moet een tweede selectbox geladen worden vanuit een database?Op zaterdag 20 december 2008 @ 17:20 schreef ludeau het volgende:
Vraagje:
Ik heb in de database een aantal categorieën & subcategorieën staan. Bij het aanmaken van een object kan men eerst de categorie selecteren. Hierna wil ik dat in een tweede selectbox de subcategorieën die bij die categorie horen, komen.
Nu heb ik een tijdje lopen googelen maar niet echt het antwoord kunnen vinden (zo moeilijk moet het toch niet zijn?)
Iemand hier een ideetje?
Dan moet je eerst een pagina maken die je database kan aanspreken (PHP, ASP), en vervolgens met ajax die pagina aanroepen...
Ja ik zat zelf ook aan de oplossing van Roy_T te denken. Ben alleen vrij matig als het op javascript neerkomt; was dus online op zoek naar een voorbeeld script maar kon geen goede keywords verzinnen. Vandaar dat ik het hier even vroeg
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 | info=[ [''], ['De keet is gesloten tot er een nieuwe plek gevonden is.'], ['Wij zijn van 2 tot en met 5 januari naar Center Parcs.'], ['Wist u dat...de Flits is verkozen tot de grootste kankerlijer van Hokje 10?'], ['Wist u dat...Bert de Boer verkozen is tot lekkerste jongen van Hokje 10?'] ] step=1 nextMessage=1 function initTSV1(){ tsvDisplay=document.getElementById("tsvcont") for(var i=0;i<2;i++){ newDiv=document.createElement("DIV") newDiv.setAttribute("id","tsvdiv"+i) newDiv.onmouseover=function(){clearTimeout(timer)} newDiv.onmouseout=function(){scrollTSV1()} newDiv.style.position="absolute" newDiv.style.padding="0 5 10 5" // top right bottom left tsvDisplay.appendChild(newDiv) } tsvDv0=document.getElementById("tsvdiv0") tsvDv1=document.getElementById("tsvdiv1") tsvDv0.innerHTML=info[0] tsvDv1.innerHTML=info[1] tsvDv0.style.top=tsvDisplay.offsetHeight tsvDv1.style.top=tsvDisplay.offsetHeight+tsvDv0.offsetHeight+"px" scrollTSV1() } function scrollTSV1(){ tsvDv0Pos=parseInt(tsvDv0.style.top) tsvDv1Pos=parseInt(tsvDv1.style.top) tsvDv0Pos-=step tsvDv1Pos-=step tsvDv0.style.top=tsvDv0Pos+"px" tsvDv1.style.top=tsvDv1Pos+"px" if(tsvDv0Pos< -tsvDv0.offsetHeight){ nextMessage++ if(nextMessage==info.length){nextMessage=0} tsvDv0.innerHTML=info[nextMessage] if(tsvDv1.offsetHeight<tsvDisplay.offsetHeight){ if(tsvDv1.offsetTop<tsvDisplay.offsetHeight-tsvDv1.offsetHeight){ tsvDv0.style.top=tsvDisplay.offsetHeight+"px" } else{ tsvDv0.style.top=tsvDv1.offsetTop+tsvDv1.offsetHeight+"px" } } else{ tsvDv0.style.top=tsvDv1.offsetTop+tsvDv1.offsetHeight+"px" } } if(tsvDv1Pos< -tsvDv1.offsetHeight){ nextMessage++ if(nextMessage==info.length){nextMessage=0} tsvDv1.innerHTML=info[nextMessage] if(tsvDv0.offsetHeight<tsvDisplay.offsetHeight){ if(tsvDv0.offsetTop<tsvDisplay.offsetHeight-tsvDv0.offsetHeight){ tsvDv1.style.top=tsvDisplay.offsetHeight+"px" } else{ tsvDv1.style.top=tsvDv0.offsetTop+tsvDv0.offsetHeight+"px" } } else{ tsvDv1.style.top= tsvDv0.offsetTop+tsvDv0.offsetHeight+"px" } } timer=setTimeout("scrollTSV1()",50) } // add onload="initTSV1()" to the opening BODY tag </script> |
Deze benader in via de functie include van PHP. Nu zegt de validator dat hij niet valid is vanwege 28 errors en 3 waarschuwingen. Maar ik heb eigenlijk geen verstand van javascript. Wat moet ik doen om bovenstaande tekst valid te maken?
.Je kunt er trouwens het script ook in een .js bestand zetten en dat bestand 'includen' (dat is het niet, maar hoe noem je dat?) in je htmlletje. Dan kijkt de validator er niet naar
.[ Bericht 25% gewijzigd door veldmuis op 31-12-2008 14:25:58 ]
Watvoor programma/debugger gebruik je daar voor dan?
quote:Ik durf te wedden dat die errors geen van allen door je JavaScript komen, maar door fouten in je HTML. Wat is de output van de validator precies?Op woensdag 31 december 2008 13:01 schreef hello_moto1992 het volgende:
Ik heb graag mijn website Valid. Nu heb ik er het volgende script in geplaatst:
Deze benader in via de functie include van PHP. Nu zegt de validator dat hij niet valid is vanwege 28 errors en 3 waarschuwingen. Maar ik heb eigenlijk geen verstand van javascript. Wat moet ik doen om bovenstaande tekst valid te maken?
quote:De W3C HTMLOp woensdag 31 december 2008 14:19 schreef mcDavid het volgende:
javascript validator?
Watvoor programma/debugger gebruik je daar voor dan?
. Die kijkt toch ook naar Javascript? Want anders zou-ie wel meer fouten geven. En als ik
<script type="text/javascript" src="external.js"></script>
Doe dan werkt het niet
quote:En met de meldingen die je krijgt, kun je de fouten niet oplossen?
[..]
De W3C HTML
En als ik
<script type="text/javascript" src="external.js"></script>
Doe dan werkt het niet
quote:Nou zonder de JS is het anders gewoon valid hoorOp woensdag 31 december 2008 14:47 schreef Roy_T het volgende:
[..]
Ik durf te wedden dat die errors geen van allen door je JavaScript komen, maar door fouten in je HTML. Wat is de output van de validator precies?
http://validator.w3.org/check?verbose=1&uri=http%3A%2F%2Fhokje10.nl%2F
quote:ja grapjas hij valideert Javascript als HTML, vind je het gek dat je errors krijgt..Op woensdag 31 december 2008 @ 14:48 schreef hello_moto1992 het volgende:
[..]
De W3C HTML
En als ik
<script type="text/javascript" src="external.js"></script>
Doe dan werkt het niet
Mocht je het geil vinden om die validator groen te krijgen zet je html-comments in je script, dus <script> <!-- //scriptcode --> </script>
-edit-
mcD hier.
quote:Niet eens. Ik heb net gekeken met de W3C validator, en die levert maar 1 fout op. Er staat namelijk twee keer een <body> in de html, 1 keer voor de javascript en 1 keer erna.
[..]
ja grapjas hij valideert Javascript als HTML, vind je het gek dat je errors krijgt..
Mocht je het geil vinden om die validator groen te krijgen zet je html-comments in je script, dus <script> <!-- //scriptcode --> </script>
-edit-
mcD hier.
quote:Ja klopt. Ik heb die onload maar in de body tag aan de bovenkant gezet. Dat werkt ookOp woensdag 31 december 2008 15:03 schreef Light het volgende:
[..]
Niet eens. Ik heb net gekeken met de W3C validator, en die levert maar 1 fout op. Er staat namelijk twee keer een <body> in de html, 1 keer voor de javascript en 1 keer erna.
. Nu is er nog één body over Het is nogal vervelend als je scriptjes gaat kopieren van ietwat out-dated websites
| 1 2 3 4 5 | <img src="images/go2.gif" name="Winkelwagen" alt="Ga naar winkelwagen" border="0" align="right"></a> <input name="zoeken" type="text" id="zoeken" value="zoekwoord..." size="14" onFocus="if(this.value=='zoekwoord...')this.value='';" onBlur="if(this.value=='')this.value='zoekwoord...';" /> |
quote:eventkey en eventcode opzoeken op internetOp donderdag 8 januari 2009 13:20 schreef donroyco het volgende:
Hoe kan ik een search box de eigenschap meegeven dat bij een hit op enter ook gezocht wordt, het is wel een fake-searchbox, die alleen maar linkt naar een volgende pagina. De code die ik gebruik is dit:
[ code verwijderd ]
Kan iemand mij helpen?
quote:Dank je wel voor het snelle antwoord
[..]
eventkey en eventcode opzoeken op internet
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 | <!-- function submitenter(e) { var keycode; if (window.event) keycode = window.event.keyCode; else if (e) keycode = e.which; if (keycode == 13) { // Doe je ding } } //--> </SCRIPT> |
En je input ding wordt dan:
| 1 |
quote:Hij pakt de URL nog niet
[ code verwijderd ]
En je input ding wordt dan:
[ code verwijderd ]
quote:Hij moet als je op enter drukt naar de pagina 'pieterbecks.html' gaan..
quote:
[..]
Hij moet als je op enter drukt naar de pagina 'pieterbecks.html' gaan..
| 1 |
quote:Hij pakt 'm nog niet
[..]
[ code verwijderd ]
Dat bij "doe je ding" neerzetten?
http://plaatsmaken.donroycodesign.nl
| 1 2 3 | <input type="text" ... /> <input type="image" onclick="this.parent.submit" /> |
Zoiets. En als je dan op enter drukt in het text-field submit 'ie hem ook vanzelf.
quote:ThanksOp donderdag 8 januari 2009 14:26 schreef HuHu het volgende:
Je hebt zelfs het input type "image", zodat je een plaatje als button kunt gebruiken. Dan doe je dus:
[ code verwijderd ]
Zoiets. En als je dan op enter drukt in het text-field submit 'ie hem ook vanzelf.
Wist niet dat het zo simpel kon, dank je wel!
en mcDavid ook quote:
De sitiutatie is als volgt:
- Ik heb meerdere select's op mijn pagina, met precies dezelfde waarde, alleen de naam van select is anders.
- Ik wil, dat zodra er één van de options wordt geselecteerd, in een willekeurige select, dat in elke select (behalve de huidige), de optie verdwijnt. Wordt de optie niet meer geselecteerd, dan moet hij weer overal verschijnen.
Duidelijk?
Dit heb ik al aan code:
| 1 2 3 4 5 6 7 8 9 10 11 | sel = document.frm.select1.selectedIndex; if(sel){ document.frm.select2.remove(sel); //document.frm.select2.selectedIndex =0; }else{ document.frm.select2.options[sel] = new Option('???wat te doen????',2); } } |
Eigenlijk zou hij alle select's op de pagina in een array moeten gooien, en vervolgens hier zn ding doen.
Maar php is meer mn ding dan javascript
Wie o wie!
In plaats van een optie verbergen moet je een optie dus verwijderen als je 'm niet meer wil laten zien. Om de optie dan later weer te kunnen laten zien heb je een lijst nodig van alle opties, of een lijst met de opties die je verborgen/verwijderd hebt.
Hij plaatst t als volgt:
boek1boek2boek3 etc
Terwijl ik wil dat het zo komt te staan:
boek1
boek2
boek3
etc
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 | <head> <title>Javascript</title> <link rel="stylesheet" href="style.css" type="text/css"> <script type="text/javascript"> // setup the main array var setArray = Array("Boek1", "Boek2", "Boek3", "Boek4", "Boek5","Boek6"); // insert the array into the DIV smalltest object function insertArray() { var theText = ""; // set the theText output to an empty string otherwise it would start with null. for (var i=0; i < setArray.length; i++) { // create the array of text to insert theText += setArray[i]; theText += "\n"; // voor de regel tussen de array records } // create the createTextNode var insertText = document.createTextNode(theText); document.getElementById("assortiment").appendChild(insertText); } </script> </head> <body> <div class="loginbalk"> <div class="divcenter"> <div class="loginkolom"> <img src="images/stip.gif" border="0" height="5" width="266"> <span class="blauw">ASSOR</span><span class="zwart">TIMENT</span> <img src="images/stip.gif" border="0" height="5" width="266"> <div class="tekstzwart" id="assortiment"> </div> </div> </div> <input type="submit" value="Bekijk alle boeken" onClick="javascript:insertArray()" /> </div> </body></html> |
quote:Zoiets idd. <input type="image" ... /> is een variant van <input type="submit" ... /> en je hebt dus geen onclick="" nodig.
Je hebt zelfs het input type "image", zodat je een plaatje als button kunt gebruiken. Dan doe je dus:
[ code verwijderd ]
Zoiets. En als je dan op enter drukt in het text-field submit 'ie hem ook vanzelf.
quote:Hij zet er wel newlines tussen (\n), maar daar doet je browser niks mee in de weergave. <br /> daarentegen...Op woensdag 14 januari 2009 17:17 schreef Apfel. het volgende:
Ik heb een array in javascript. De output hiervan wil ik in een div laten uitkomen. Echter plaatst hij de gehele array achter elkaar erin.
Hij plaatst t als volgt:
boek1boek2boek3 etc
Terwijl ik wil dat het zo komt te staan:
boek1
boek2
boek3
etc
quote:<br /> heb ik ook al geprobeerd. Dan geeft ie gewoon boek1 < br/> boek2 < br/> boek3 < br/> weerOp donderdag 15 januari 2009 14:53 schreef Roy_T het volgende:
[..]
Hij zet er wel newlines tussen (\n), maar daar doet je browser niks mee in de weergave. <br /> daarentegen...
quote:Komt denk ik door dat je createTextNode gebruikt ipv createElement. < en > worden geconverteert naar de html entity's.Op donderdag 15 januari 2009 @ 18:27 schreef Apfel. het volgende:
[..]
<br /> heb ik ook al geprobeerd. Dan geeft ie gewoon boek1 < br/> boek2 < br/> boek3 < br/> weer
-edit- dit werkt wel:
| 1 2 3 | insertText.innerHTML = theText; document.getElementById("assortiment").appendChild(insertText); |
-edit- of in dit geval korter:
| 1 |
[ Bericht 17% gewijzigd door mcDavid op 15-01-2009 18:49:40 ]
quote:Ah... ik was even vergeten dat image hetzelfde is als submit.
[..]
Zoiets idd. <input type="image" ... /> is een variant van <input type="submit" ... /> en je hebt dus geen onclick="" nodig.
Hoe kan ik middels XMLHTTP settings geschreven in php gebruiken in javascript? dus niet een stuk tekst vervangen met innerHTML maar gegevens uitlezen, mag XML maar liever arrays en variables
Maar als ik je goed begrijp, kun je het beste JSON notatie gebruiken (JavaScript Object Notation). Met json_encode() kun je in PHP 5.2+ eenvoudig een array omzetten naar een JSON.
Ik zou een JS library gebruiken als jQuery om die data op te halen dmv een AJAX-request en te parsen.
[ Bericht 15% gewijzigd door Roy_T op 20-01-2009 16:16:42 ]
quote:Van de JS libraries vind ik dat persoonlijk de prettigste en cleanste. Welke heeft jouw voorkeur?Op dinsdag 20 januari 2009 18:10 schreef SuperRembo het volgende:
He bah geen jQuery alsjeblieft.
Als ik Chandler was zou ik iig een library gebruiken, en niet zelf het wiel opnieuw uitvinden.
quote:jQuery helpt normale javascript code om zeep en dringt enorm z'n eigen stijl op. Prototypejs heeft dat iets minder, maar daarmee kan je ook geen normale for(.. in ..) loopjes meer maken. Ik heb prototypejs + scriptaculous voor m'n toen/nu site gebruikt, maar voor de volgende versie ben ik wel op zoek naar een nieuwe library. Misschien wordt het YUI.
[..]
Van de JS libraries vind ik dat persoonlijk de prettigste en cleanste. Welke heeft jouw voorkeur?
Als ik Chandler was zou ik iig een library gebruiken, en niet zelf het wiel opnieuw uitvinden.
Maar iig Chandler: gebruik er eentje die je aanstaat
maar dat weten de meeste al.Ik wil gewoon variabelen uitspugen met mijn php scripting en kunnen gebruiken in javascripting.
daarvoor zou JSON idd erg handig zijn, maar moet ik dan gebruik maken van een externe library? wil liever gewoon de array van php naar js porten zonder al te veel extra scripting
quote:Daar is juist een library voor: het minder zelf hoeven scripten.Op dinsdag 20 januari 2009 20:17 schreef Chandler het volgende:
Ik ben idd lekker duidelijk
Ik wil gewoon variabelen uitspugen met mijn php scripting en kunnen gebruiken in javascripting.
daarvoor zou JSON idd erg handig zijn, maar moet ik dan gebruik maken van een externe library? wil liever gewoon de array van php naar js porten zonder al te veel extra scripting
[ Bericht 5% gewijzigd door #ANONIEM op 20-01-2009 20:46:51 ]
Ik zou jQuery echter downloaden en 1 regel besteden aan $.getJSON
quote:De loopjes met .each() vind juist ik de meest waardeloze feature van jQuery/prototypejs. Zeker met dat gepruts om er toch nog functionaliteit foor break of continue in te bouwen
Ah, dat probleem heb ik helemaal niet met jQuery, maar als ik een library gebruik dan zorg ik ook dat ik 'm overal gebruik. Dus ook voor loops.
quote:Ik ben het met je eens dat het wel bij je moet passen, en dat het alleen werkt als je je manier van proggen erop aanpast. Whatever floats your boatOp dinsdag 20 januari 2009 22:53 schreef SuperRembo het volgende:
De loopjes met .each() vind juist ik de meest waardeloze feature van jQuery/prototypejs. Zeker met dat gepruts om er toch nog functionaliteit foor break of continue in te bouwen
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 | #### # Function: _jsonEncode # Purpose: To encode a variable into json format # Arguments: $encodeMe: the variable to convert into JSON format # $encodeAs : the name of the variable to save $var1 as. # REQUIRED if $encodeMe is not an array # Usage: # echo _jsonEncode('test','var1');// outputs: {"var1":test"} # echo _jsonEncode(TRUE,'var1'); // outputs: {"var1":1} # echo _jsonEncode(123,'var1'); // outputs: {"var1":123} # echo _jsonEncode(array('orange'=>1,'blue'=>2,'green'=>3)); // outputs: {"orange":1,"blue":2,"green":3} # # Author: Dylan Anderson # License: GPLv3 #### function _jsonEncode($encodeMe,$encodeAs=FALSE){ $output = '{'; if(is_array($encodeMe)){ foreach($encodeMe as $key=>$value){ $output .= '"'.$key.'":'; if(is_array($value)){ $function = __FUNCTION__; $output .= $function($value); } else if(is_numeric($value)) $output .= $value; else $output .= '"'.str_replace('"','\"',$value).'"'; $output .= ','; } $output = rtrim($output,',').'}'; } else if(strlen($encodeAs)){ if(is_numeric($encodeMe)) $output .= '"'.$encodeAs.'":'.$encodeMe.'}'; else if(is_bool($encodeMe)){ $encode_value = ($encodeMe) ? 1 : 0; $output .= '"'.$encodeAs.'":'.$encode_value.'}'; } else if(is_string($encodeMe)) $output .= '"'.$encodeAs.'":'.str_replace('"','\"',$encodeMe).'"}'; } else $output = FALSE; return($output); } ?> |
maar is er ook los stukje scripting te vinden voor javascript die json kan omzetten naar een array?
quote:Als je een PHP array goed encode naar JSON, dan is dat al een JS array. {"elements":[1, 2, 3]} bevat gewoon wat in PHP $elements = array(1, 2, 3) zou zijn.Op woensdag 21 januari 2009 10:24 schreef Chandler het volgende:
maar is er ook los stukje scripting te vinden voor javascript die json kan omzetten naar een array?
Ik heb zelf al toegevoegd dat de checkboxes niet geprint worden, dat gaat ook goed.. Heb ik gedaan met class="DONTPrint" toe te voegen aan de <input type="checkbox"
Dus hoe voeg ik meer checkboxes toe met dezelfde functionaliteit als die er al stonden?
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 | 1. Copy the coding into the HEAD of your HTML document 2. Add the last code into the BODY of your HTML document --> <!-- STEP ONE: Paste this code into the HEAD of your HTML document --> <HEAD> <style type="text/css"> <!-- @media print { .DONTPrint{ display:none } .DOCheck { display:table} } --> </style> <script type="text/javascript"> <!-- /* This script and many more are available free online at The JavaScript Source :: http://javascript.internet.com Created by: Thony den Braber :: http://www.orangespirits.nl */ function select_row(row, color) { if(row.parentNode.parentNode.style.backgroundColor != color) { row.parentNode.parentNode.style.backgroundColor = color; row.parentNode.parentNode.className = 'DOPrint' } else { row.parentNode.parentNode.style.backgroundColor = ''; row.parentNode.parentNode.className = 'DONTprint' } } function mouseover(row, font_color, checkedcolor) { if(row.style.color != checkedcolor) { row.style.color = font_color; } } function mouseout(row, font_color, checkedcolor) { if(row.style.color != checkedcolor) { row.style.color = font_color; } } // --> </script> </HEAD> <!-- STEP TWO: Copy this code into the BODY of your HTML document --> <BODY> <form> <p> </p> <p>Test kop</p> <p> </p> <p> </p> <p> </p> <table width="103" border="0" cellpadding="0" cellspacing="0"> <tr> <td width="24" align="center"> </td> <td width="79" align="center"><strong>Name</strong></td> </tr> <tr onMouseOver="mouseover(this,'#cc6600','#cc6600');" onMouseOut="mouseout(this,'#000000','#000000')" class='DONTPrint'> <td><input type="checkbox" name="checkbox1" onClick="select_row(this, '#cccccc'); class="DONTPrint""></td> <td>print</td> </tr> <tr onMouseOver="mouseover(this,'#cc6600','#cc6600');" onMouseOut="mouseout(this,'#000000','#000000')" class='DONTPrint'> <td><input type="checkbox" name="checkbox1" onClick="select_row(this, '#cccccc');" class="DONTPrint"></td> <td>niet</td> </tr> <tr onMouseOver="mouseover(this,'#cc6600','#cc6600');" onMouseOut="mouseout(this,'#000000','#000000')" class='DONTPrint'> <td><input type="checkbox" name="checkbox1" onClick="select_row(this, '#cccccc');" class="DONTPrint"></td> <td>print</td> </tr> <tr onMouseOver="mouseover(this,'#cc6600','#cc6600');" onMouseOut="mouseout(this,'#000000','#000000')" class='DONTPrint'> <td><input type="checkbox" name="checkbox1" onClick="select_row(this, '#cccccc');" class="DONTPrint"></td> <td>niet</td> </tr> <tr onMouseOver="mouseover(this,'#cc6600','#cc6600');" onMouseOut="mouseout(this,'#000000','#000000')" class='DONTPrint'> <td><input type="checkbox" name="checkbox1" onClick="select_row(this, '#cccccc');" class="DONTPrint"></td> <td>print</td> </tr> <tr onMouseOver="mouseover(this,'#cc6600','#cc6600');" onMouseOut="mouseout(this,'#000000','#000000')" class='DONTPrint'> <td><input type="checkbox" name="checkbox1" onClick="select_row(this, '#cccccc');" class="DONTPrint"></td> <td>niet</td> </tr> <tr onMouseOver="mouseover(this,'#cc6600','#cc6600');" onMouseOut="mouseout(this,'#000000','#000000')" class='DONTPrint'> <td><input type="checkbox" name="checkbox1" onClick="select_row(this, '#cccccc');" class="DONTPrint"></td> <td>print</td> </tr> </table> <p> </p> <p> </p> </form> <p>test eind</p> |
[ Bericht 44% gewijzigd door wc-eend op 25-01-2009 09:23:49 ]
quote:Veranderd, tag stond niet goed..
Kun je die code niet beter tussen [ code] en [ /code] zetten? Wordt'ie veel beter leesbaar van.
Overigens denk ik niet dat het een javascriptprobleem is; die paar regels javascript in de code zien er wel goed uit.
gallery: http://hockeyfeesthoevelaken.nl/fotoboek.php
deeplink naar foto: http://hockeyfeesthoevelaken.nl/fotoboek.php?page=0#0 (deze geeft dus de foutmelding in IE7)
verantwoordelijke stukje script:
| 1 2 3 4 5 6 7 8 | { var x = location.hash.slice(1); //nummer eruit knippen if (document.getElementById("img" + x )){ var y = document.getElementById("img" + x ).name; //bijbehorende fotonaam uit de DOM halen openPic(y,x); //lightbox openen met (fotonaam,fotonummer) } } |
//edit:
nog wat extra info:
- het bovenstaande script wordt wel gewoon geheel uitgevoerd, maar daarna geeft'ie de melding :
quote:de website http://enz. kan niet worden geopend.
de bewerking is afgebroken
[ Bericht 4% gewijzigd door mcDavid op 25-01-2009 19:44:33 ]
quote:Op Experts Exchange lees ik iets dat de JavaScript code eerder wordt uitgevoerd dan de pagina wordt gerendered en bepaalde dingen dus nog niet beschikbaar zijn voor IE. Een oplossing zou zijn je JavaScript code een paar milliseconden te laten wachten.
Ik heb een gallery met een lightbox gemaakt... om direct naar een foto te kunnen linken plaats ik met javascript het nummer van desbetreffende foto achter de hash in de url. In firefox werkt dat, maar IE7 geeft een maffe foutmelding als je zo'n url opent! Iemand enig idee hoe dat komt?
gallery: http://hockeyfeesthoevelaken.nl/fotoboek.php
deeplink naar foto: http://hockeyfeesthoevelaken.nl/fotoboek.php?page=0#0 (deze geeft dus de foutmelding in IE7)
verantwoordelijke stukje script:
[ code verwijderd ]
//edit:
nog wat extra info:
- het bovenstaande script wordt wel gewoon geheel uitgevoerd, maar daarna geeft'ie de melding :
[..]
Zie: http://www.experts-exchan(...)ript/Q_23514976.html Alleen kan ik die pagina niet goed lezen, omdat je lid moet zijn enzo.
-edit-
vervolgvraag:
als iemand weet waarom die 'volgende' knop niet verschijnt als hij de lightbox via de hash opent... mag diegene het zeggen
quote:Zorgen dat Google in je referer staat en dan flink scrollen.
[..]
Zie: http://www.experts-exchan(...)ript/Q_23514976.html Alleen kan ik die pagina niet goed lezen, omdat je lid moet zijn enzo.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 | <script type="text/javascript"> document.cookie = "divBottom"; function test() { window.location.hash = '#' + document.cookie; } </script> <body onload="test()"> <div id="divTop" style="height:1000">Top</div> <div id="divBottom">Bottom</div> </body> </html> |
quote:Ik gebruik geen Firefox
[..]
Zorgen dat Google in je referer staat en dan flink scrollen.
[ code verwijderd ]
. Maar ik laad de pagina altijd in de Google Cache, dat werkt ook.dus gewoon simpel gezegd in 1x de gehele inhoud van een selectbox kopieren van de ene naar de ander that's all.. nu dacht ik zelf aan een functie die alle items doorloopt maar lijkt het mij handiger als dit in 1x gedaan zou kunnen worden..
quote:Middels cloneNode() de selectbox kopiëren en ergens anders weer aan hangen?
Weet iemand hoe je snel een selectbox kunt dupliceren middels javascript? ik heb gezocht maar niet gevonden.
dus gewoon simpel gezegd in 1x de gehele inhoud van een selectbox kopieren van de ene naar de ander that's all.. nu dacht ik zelf aan een functie die alle items doorloopt maar lijkt het mij handiger als dit in 1x gedaan zou kunnen worden..
Functie tips?
| 1 2 3 4 | b = a.cloneNode(true); document.getElementById('andere_node').appendChild(b); |
quote:Als het enigsins mogelijk is kan je beter gewoon de property gebruiken in plaats van setAttribute. Dat levert cross-browser veel minder problemen op.
met setAttribute() moet je een eind komen
Dus
| 1 2 3 4 | var fieldCopy = field.cloneNode(true); fieldCopy.name = 'copy'; container.appendChild(fieldCopy); |
Wel ff opletten dat er in IE een bug zit waardoor zo'n nieuw form wel niet aan de form.elements array wordt toegevoegd.
Volgens mij heb je hier javascript voor nodig
quote:Bedankt voor de link, dit zit al mooi in de richting
Maar ik snap niet zoveel van dat script, met dat script kun je toch alleen maar blokjes groter maken?
quote:Nee, dat script maakt blokjes groter, als voorbeeld. Dan zie je duidelijk wat er gebeurt. Je zou ook de kleur kunnen aanpassen. Of iets anders, maar dat moet je dan wel zelf schrijven.
[..]
Bedankt voor de link, dit zit al mooi in de richting
Maar ik snap niet zoveel van dat script, met dat script kun je toch alleen maar blokjes groter maken?
Oh, en je hebt ook nog prototype, die heeft vast ook wel zoiets.
Ik zou iig voor een library gaan, zelf schrijven kost véél meer tijd.
twee snippets code die WEL werken onder safari, konqueror, opera, internet explorer, (firefox onder windows en opensuse) maar niet onder firefox onder ubuntu 8.10
Iemand een suggestie?
hier de code voor een menu met alternerende images (mouseover)
het probleem is dat het laatste item onder ff onder ubuntu helemaal niet te zien
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 | //<![CDATA[ <!-- Begin image1 = new Image(); image1.src = "images/homeo.png" alt="home"; image2 = new Image(); image2.src = "images/onso.png" alt="overons"; image3 = new Image(); image3.src = "images/jelleo.png" alt="jelle"; image4 = new Image(); image4.src = "images/paulo.png" alt="paul"; image5 = new Image(); image5.src = "images/agendao.png" alt="agenda"; image6 = new Image(); image6.src = "images/fotoso.png" alt="foto"; image7 = new Image(); image7.src = "images/contacto.png" alt="contact"; // End --> //]]> </script> |
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 | <a href="./index.php?action=home" onmouseover="image1.src='images/homeo.png';" onmouseout="image1.src='images/home.png';"> <img name="image1" src="images/home.png" alt="home" border="0"/></a> <a href="./index.php?action=info" onmouseover="image2.src='images/onso.png';" onmouseout="image2.src='images/ons.png';"> <img name="image2" src="images/ons.png" alt="overons" border="0"/></a> <a href="./index.php?action=jelle" onmouseover="image3.src='images/jelleo.png';" onmouseout="image3.src='images/jelle.png';"> <img name="image3" src="images/jelle.png" alt="jelle" border="0"/></a> <a href="./index.php?action=paul" onmouseover="image4.src='images/paulo.png';" onmouseout="image4.src='images/paul.png';"> <img name="image4" src="images/paul.png" alt="paul" border="0"/></a> <a href="./index.php?action=agenda" onmouseover="image5.src='images/agendao.png';" onmouseout="image5.src='images/agenda.png';"> <img name="image5" src="images/agenda.png" alt="agenda" border="0"/></a> <a href="./index.php?action=foto" onmouseover="image6.src='images/fotoso.png';" onmouseout="image6.src='images/fotos.png';"> <img name="image6" src="images/fotos.png" alt="foto" border="0"/></a> <a href="./index.php?action=contact" onmouseover="image7.src='images/contacto.png';" onmouseout="image7.src='images/contact.png';"> <img name="image7" src="images/contact.png" alt="contact" border="0"/></a> </div> |
als ik echt blind ben.. laat het me maar weten
quote:het probleem is dat ik het als screendump heb gekregen en later zelf heb ondervonden onder suse doet 'ie het welOp woensdag 4 februari 2009 23:12 schreef SuperRembo het volgende:
Heb je niet een eenvoudigere testcase? En wat is werkt er dan niet? Staat 't misschien ergens online zodat 't makkelijker te testen is?
quote:Als je het als screendump hebt gekregen, staat die site vast ook ergens online. Da's makkelijker meekijken.
[..]
het probleem is dat ik het als screendump heb gekregen en later zelf heb ondervonden onder suse doet 'ie het wel
Ouderwetse code past dan wel weer goed bij de inhoud van de site.
Ik ga eens stechelen met mijn vormgevert of dit niet anders kan..
nu nog checken of het met 10 pixels meer in #menu op de meeste systemen genoeg is..
quote:Dan moet die zich eens laten bijscholen
dat stukje hopeloos ouderwetse code is geschreven door mijn vormgever..
quote:Genoeg mogelijkheden. Het menu kun je als een unordered list maken, dan kun je ook precies aangeven wat de afstand tussen de elementen moet zijn. En met achtergrondplaatjes bij de linkjes heb je geen javascript nodig.Ik ga eens stechelen met mijn vormgevert of dit niet anders kan..
Oh, de negatieve margins zijn ook al niet handig/nodig. Met een goede opzet heb je die niet/nauwelijks nodig.
quote:Ik denk het wel, maar een andere opzet van #menu is beter.nu nog checken of het met 10 pixels meer in #menu op de meeste systemen genoeg is..
| 1 2 3 4 5 | <li><a href="home.html" id="home">Home</a></li> <li><a href="overons.html" id="overons">Over ons</a></li> ... </ul> |
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 | width: 720px; margin: 0; padding: 0; list-style: none; } #menu li { width: 100px; margin: 0; padding: 0; } #menu li a { text-indent: -999em; display: block; } #menu #home { background: url(images/home.jpg); } #menu #home:hover { background: url(images/home_over.jpg); } |
Dat lijkt me wel genoeg als voorbeeld
Ik ga hier eens (offline) mee spelen
nogmaals bedankt en welterusten
quote:Het zit standaard in jQuery UI, en als je Prototype gebruikt kun je Scriptaculous gebruiken. Eigenlijk iedere library heeft wel drag & drop functionaliteit.Op zondag 1 februari 2009 13:56 schreef veldmuis het volgende:
Je kunt ook even zoeken of jquery een drag&drop-iets heeft. jquery is ook een mooie library.
Oh, en je hebt ook nog prototype, die heeft vast ook wel zoiets.
quote:Amen. Als het al lukt als beginner.Ik zou iig voor een library gaan, zelf schrijven kost véél meer tijd.
kan ik een functie aanroepen met een array.
dus:
| 1 |
Want mijn functie geeft terug dat i undefined is:
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 | { try //Internet Explorer { xmlDoc=new ActiveXObject("Microsoft.XMLDOM"); } catch(e) { try //Firefox, Mozilla, Opera, etc. { xmlDoc=document.implementation.createDocument("","",null); } catch(e) { alert(e.message); return; } } xmlDoc.async=false; xmlDoc.load(communication_file); for ( var i in values ) { document.getElementById .innerHTML=xmlDoc.getElementsByTagName[0].childNodes[0].nodeValue;} } |
| 1 |
quote:Moet je er wel een array in stoppen, dus:Op woensdag 11 februari 2009 11:53 schreef Swetsenegger het volgende:
kan ik een functie aanroepen met een array.
| 1 |
En ik gebruik het nu in Safari (op windows) Veldmuis. Zal zo even met chrome testen.
De volgende stap wordt schrijven naar xml vanuit clientside. Daar zal ik denk ik sowieso met ajax calls moeten gaan werken denk ik.
-edit- Safari inderdaad ook niet, bleek in firefox aan het testen te zijn
Nou ja.... xmlhttprequest dan maar.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 | function loadXMLDoc(){ if (window.XMLHttpRequest) { xml=new XMLHttpRequest(); } else if (window.ActiveXObject) { xml=new ActiveXObject("Microsoft.XMLHTTP"); } if (xml!=null) { xml.open("GET",xmlPath,false); xml.send(null); xml = xml.responseXML; } } |
Nu schrijven
De gebruiker kan al op een interactive manier de kolomen verplaatsen etc, maar nu zou het mooi zijn
als het ook mogelijk is om de kolom breedte aan te kunnen passen, door te slepen.
Heb het vaker gezien, dus het zou mogelijk moeten zijn. Iemand een idee hoe te doen??
quote:kijk eens naar een framework zoals mootools bijvoorbeeld: http://demos111.mootools.net/Resizable
Ik heb icm met AJAX een aantal kolomen zoals in dit voorbeeld:
[ afbeelding ]
De gebruiker kan al op een interactive manier de kolomen verplaatsen etc, maar nu zou het mooi zijn
als het ook mogelijk is om de kolom breedte aan te kunnen passen, door te slepen.
Heb het vaker gezien, dus het zou mogelijk moeten zijn. Iemand een idee hoe te doen??
Whatever floats your boat | 1 2 3 4 5 6 7 8 9 10 | /* Resizable with Horizontal Limit */ $('resizable5').makeResizable({ modifiers: {x: 'width', y: false}, limit: {x: [50, 800]} } ); }); |
Opzich best simpel, maar hoe haal ik nu de waardes er uit zodra er iets wordt veranderd?
quote:Op woensdag 11 februari 2009 14:27 schreef Roy_T het volgende:
Je kunt vast ergens een callback toevoegen die wordt uitgevoerd als iemand klaar is met resizen, waarbinnen je de beschikking hebt over de nieuwe maten. Daarin kun je dan een AJAX POST doen naar je PHP-script
Dat is inderdaad de bedoeling
maar waar in die functie?| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 | /* Resizable with Horizontal Limit */ $('resizable5').makeResizable({ modifiers: {x: 'width', y: false}, limit: {x: [50, 800]} } ); } ); function saveWidth(){ var width = document.getElementById("resizable5").offsetWidth; callAJAX(0, 120, 'setWidth', width); } |
:D
quote:Dat zal vast in de docs staan van de gebruikte JS library. Dat is voor ons natuurlijk koffiedik kijkenOp woensdag 11 februari 2009 14:30 schreef Likkende_Lassie het volgende:
Dat is inderdaad de bedoeling
Ik zou echt even in de API docs kijken naar een callback die je direct in makeResizable() op kunt nemen, imo een stuk netter.
quote:Door een "onmouseup"Op woensdag 11 februari 2009 15:02 schreef Roy_T het volgende:
En waar wordt saveWidth() aangeroepen dan?
Ik zou echt even in de API docs kijken naar een callback die je direct in makeResizable() op kunt nemen, imo een stuk netter.
Probleem hiervan is wel, dat als je de muis buiten de div loslaat, wordt er niets opgeslagen...
quote:Waarschijnlijk moet er een event listener worden toegevoegd aan de resize()Op woensdag 11 februari 2009 15:02 schreef Roy_T het volgende:
En waar wordt saveWidth() aangeroepen dan?
Ik zou echt even in de API docs kijken naar een callback die je direct in makeResizable() op kunt nemen, imo een stuk netter.
quote:Ik heb maar even voor je gekeken, want dat is inderdaad geen oplossingOp woensdag 11 februari 2009 15:30 schreef Likkende_Lassie het volgende:
[..]
Door een "onmouseup"
Probleem hiervan is wel, dat als je de muis buiten de div loslaat, wordt er niets opgeslagen...
In de docs staat écht heel duidelijk:
| 1 2 3 4 5 | onComplete: function(){ alert('Done resizing.'); } |
Heb je überhaupt die documentatie gelezen?
-edit- laat ik het anders zeggen. Weet iemand of het mogelijk is om op een embedded linux device vanuit de GUI middels clientside scripting informatie in een xml file te schrijven aan de 'server' kant. Waarbij ze dus beide op hetzelfde lokale filesystem draaien.
[ Bericht 59% gewijzigd door Swetsenegger op 11-02-2009 16:26:25 ]
Iemand een zoekterm, site of script hiervoor?
quote:Ook na je edit snap ik niet echt wat je wilt doenOp woensdag 11 februari 2009 15:40 schreef Swetsenegger het volgende:
Weet iemand of ik met javascript, via SOAP een node kan aanpassen in een XML file op de server?
-edit- laat ik het anders zeggen. Weet iemand of het mogelijk is om op een embedded linux device vanuit de GUI middels clientside scripting informatie in een xml file te schrijven aan de 'server' kant. Waarbij ze dus beide op hetzelfde lokale filesystem draaien.
Je wilt JS draaien op je linux ding, en die iets laten schrijven op het filesystem (als de server datzelfde ding is) quote:Nee, want daar is het te simpel voorOp donderdag 12 februari 2009 16:18 schreef Superheld het volgende:
Ik zoek een prijsberekenings script / uitleg hoe te maken maar vind weinigs, zoek zoiets als deze
Iemand een zoekterm, site of script hiervoor?
Het komt neer op de waarde van select 1 en select 2 bij elkaar optellen, en het resultaat daarvan te tonen in een div (of input, of whatever). Dat moet te doen zijn denk ik, voor een beginner
Ik ben een dynamische pagina aan het maken waarbij het mogelijk is een aantal div's te sluiten. Ook moeten divs die niet zichtbaar zijn gesloten worden, en dit lijkt nogal een probleem te zijn in IE, in FF gaat alles wel naar wens.
Ik sluit de divs doormiddel van een loopje in Javascript, deze loop maakt alle divs met een bepaalde id onzichtbaar door de display eigenschap op 'none' te zetten. De zichtbare divs vormen geen probleem, echter werk ik met meerdere pagina's die allemaal voorgeladen zijn, zodat het switchen tussen de pagina's lekker snel gaat.
Als ik nu naar een pagina ga waarbij de div's gesloten zijn toen de pagina nog niet zichtbaar was, dan is de inhoud (een paar tabellen) van de divs binnen die pagina nog zichtbaar. Niet de hele tabel is zichtbaar, alleen de achtergrondkleur van de cellen.
Als ik vervolgens deze divs weer volledig zichtbaar maak dan loopt de achtergrondkleur van de cellen door de andere inhoud heen, en dat is erg vervelend en ziet er niet uit.
Blijkbaar vind IE het niet zo leuk dat een eigenschap van een niet zichtbare div aangepast wordt, en laat een gedeelte van de inhoud staan. Ik heb het volgende geprobeerd:
-Alle divs een eigen achtergrondkleur geven, dit was namelijk eerst niet voor alle divs gedefinieerd
-Voordat de loop begint de onzichtbare divs zichtbaar maken, vervolgens de eigenschap aanpassen en dan weer onzichtbaar maken
-Alle inhoud van de te sluiten divs ook verbergen dmv jQuery
Bovenstaande heeft niet mogen baten, ik ik heb werkelijk geen idee hoe dit op te lossen is. Zoals aangegeven gebeurd dit alleen in IE, niet in Fx.
Iemand een idee om deze vervelende bug te omzeilen?
quote:Een testcase kan ik wel ff maken, alleen ben ik bang dat dat pas morgen wordt... De code zelf kan ik hier helaas niet posten.
Wat voorbeeldcode of een simpele testcase zou handig zijn.
| 1 |
Waarom werkt dit niet? Als ik bijvoorbeeld de tekstkleur wil aanpassen, werkt dat wel...
quote:En hetzelfde geld dus ook voor backgroundImage?
Dit had je in 1 seconde kunnen opzoeken, maar vooruit: je moet in JS geen dashes maar camelCasing gebruiken: backgroundColor dus.
quote:Voor alles met een -.Op zondag 1 maart 2009 23:10 schreef Flaccid het volgende:
[..]
En hetzelfde geld dus ook voor backgroundImage?
Broncode: http://www.thuisserver.net/temp/bron.txt (rechtsklik->opslaan als)
Het is heel simpel om het probleem zichtbaar te maken. Als je de pagina opent dan ben je op pagina1, ga nu vervolgens naar pagina 2, klik dan op 'alles inklappen' en ga terug naar pagina 1, de layout is dan verneukt. Als je daarna alles inklapt en weer uitklapt dan is het weer goed.
Dit probleem treed niet op in Fx, alleen bij IE gaat het mis.
[ Bericht 8% gewijzigd door The_Terminator op 02-03-2009 16:34:32 ]
Een id moet trouwens altijd beginnen met een letter. Helemaal numerieke id's kunnen op allerlei manieren problemen geven.
quote:Thanks, probleem verholpen. Overigens was dat met die numerieke id's alleen even voor de test, in mijn werkelijke applicatie staat er iets voor, net als bij de pagina divs.
Het heeft in iedere geval te maken met prosition:relative. Als je die weg laat werkt het ook in IE.
Een id moet trouwens altijd beginnen met een letter. Helemaal numerieke id's kunnen op allerlei manieren problemen geven.
quote:Dat laatste is al besproken, ik laat het zo.
Ik zou eerst een mooiere oplossing voor "Close [X]" verzinnen. Het zou ook mooi zijn als alles ook zonder javascript te bekijken zou zijn.
Ja ik weet niet wat ik daar kan neerzetten, eerst had ik een plaatje, maar dat was heel lelijk.
Anders nog iets:
| 1 2 3 4 5 6 7 8 9 10 11 12 | var scrolling = document.getElementById('iframe').scrolling switch (scrolling) { case 'no': document.getElementById('iframe').scrolling = 'yes'; break; case "yes": document.getElementById('iframe').scrolling = 'no'; break; } } |
Doet het niet in IE7. Wel in FF
Beter zoek je 'm 1 keer op in de DOM en zet de referentie in een variabele, die je vervolgens gebruikt.
quote:Zo goed kan ik niet javascripten.
Los van je probleem: 3 keer document.getElementById('iframe' zorgt voor onnodige overhead.
Beter zoek je 'm 1 keer op in de DOM en zet de referentie in een variabele, die je vervolgens gebruikt.
quote:
volgens mij bedoelt hij zoiets:
| 1 2 3 4 5 6 7 8 9 10 11 12 | var frame = document.getElementById('iframe') switch (frame.scrolling) { case 'no': frame.scrolling = 'yes'; break; case "yes": frame.scrolling = 'no'; break; } } |
quote:Ik wist niet eens dat dat zo kon!
[..]
volgens mij bedoelt hij zoiets:
[ code verwijderd ]
Maar nogsteeds doet hij het niet in IE
| 1 2 3 4 5 | { var el = document.getElementById(id); el.scrolling = (el.scrolling == 'yes' ? 'no' : 'yes'); } |
Je kan proberen of je het met css wel voor elkaar krijgt. Bijvoorbeeld met overflow.
Voor een eigen project ben ik opzoek naar een scriptje voor Google maps waarbij je de volgende dingen kunt doen.
1. het zoeken naar een adres (via tekst veld & button) die dan verschijnt op de map
2. Wanneer men klikt wordt een pointer geplaatst, wanneer deze niet goed is moet deze verplaatst kunnen worden.
3. Een button om de positie op te slaan (versturen via een form).
Weet iemand waar ik dit kan vinden? heb zelf net een uur in de code van google gespit maar kan er niet echt uitkomen
Het opslaan van de positie kan je vie een form post doen of anders met een ajax call.
Dit kun je echt in een uur bouwen als Google Maps noob.Ook de voorbeelden van google zelf wordt ik niet echt wijzer van, maar goed we gaan gewoon door
Maar gelukkig kan je ook knippen en plakken.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 | function(overlay, point) { if (point) { // display points alert(point.y + " - " + point.x); if (marker) { map.removeOverlay(marker); } var center = new GLatLng(point.y, point.x); var marker = new GMarker(center, {draggable: true}); GEvent.addListener(marker, "dragstart", function() { map.closeInfoWindow(); GEvent.addListener(marker, "dragend", function() { marker.openInfoWindowHtml("Just bouncing along..."); map.addOverlay(marker); } |
alleen wil ik maar 1 marker per map hebben, als er op een andere plek geklikt wordt moet de huidige marker verdwijnen, dit probeerde ik zo te doen maar op een of andere manier is de marker dan niet meer 'herkenbaar' in de code, hoe kan ik dit oplossen?
[ Bericht 80% gewijzigd door Chandler op 05-03-2009 11:46:23 ]
verder heb ik er nog geen code instaan
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 | window.onload = function() { if (!GBrowserIsCompatible()) return; window.onunload = GUnload; var map = new GMap2(document.getElementById("map_canvas")); map.setCenter(new GLatLng(52, 5), 10); GEvent.addListener(map, 'click', function(overlay, point) { //if (!point) return; if (marker) { // Remove privious marker map.removeOverlay(marker); } // Create new marker var center = new GLatLng(point.y, point.x); marker = new GMarker(center, {draggable: true}); map.addOverlay(marker); } ) ; } |
Maar misschien is het beter/handiger om de bestaande marker steeds te hergebruiken.
Ps weet je ook of het mogelijk is via coordinaten achter de naam van de lokatie te komen?
Bv Groningen, Amsterdam, Brabant->Boxtel oid.
[ Bericht 43% gewijzigd door Chandler op 05-03-2009 15:07:47 ]
(antwoord: ja, je kunt via de Google API een adres bij een coördinaat zoeken)| 1 2 3 | image.src = "image/" + galleryArray[currentImage]; var imgHeight = image.height; |
Wie weet hoe ik het voor IE en Chrome netjes kan oplossen?
quote:Gedaan maar mijn zoekkunsten zijn echt n00b achtig... misschien een aanwijzing in de goede richting?
Lees de docs
http://code.google.com/ap(...)tml#ReverseGeocoding
Op Google zoeken naar de locatie van de API, dan naar Services (want die wil je gebruiken) en dan "Reverse Geocoding"
quote:Waarschijnlijk is het plaatje dan nog niet geladen.
Ik moet de hoogte en breedte van plaatjes uit een array hebben. Met onderstaande code geeft hij in FF en Opera wel een hoogte terug. Maar in IE en Chrome geeft hij 0 terug.
[ code verwijderd ]
Wie weet hoe ik het voor IE en Chrome netjes kan oplossen?
quote:Helaas
.quote:Klopt daar dacht ik ook zelf aan, ik was in de tussentijd al weer verder gegaan. Opeens deed hij het in IE welOp donderdag 5 maart 2009 16:30 schreef SuperRembo het volgende:
[..]
Waarschijnlijk is het plaatje dan nog niet geladen.
? Maar in Chrome gaat hij nu helemaal vaag doen.Het enige dat ik aan de code heb toegevoegd is:
| 1 2 3 4 5 6 7 8 9 10 11 12 | image.src = "image/" + galleryArray[currentImage]; var imgHeight = image.height; var imgWidth = image.width; if(imgHeight > imgWidth) { var imgStyleValue = "height: " + (imageDivHeight - 6); } else if (imgWidth > imgHeight) { var imgStyleValue = "width: " + (imageDivWidth - 6); } |
De afbeeldingen die ik gebruik, soort van "bullets", veranderen niet allemaal mee. Namelijk alleen de eerste veranderd van kleur. Zou iemand die meer kijk/verstand van javascript heeft hier even naar willen kijken en eventueel een oplossing aandragen?
Script wat de kleur moet veranderen.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 | { var colors = new Array(); colors[0] = "black"; // "img/bullet_black.png"; colors[1] = "blue"; // "img/bullet_blue.png"; colors[2] = "green"; // "img/bullet_green.png"; colors[3] = "orange"; // "img/bullet_orange.png"; colors[4] = "pink"; // "img/bullet_pink.png"; colors[5] = "purple"; // "img/bullet_purple.png"; colors[6] = "red"; // "img/bullet_red.png"; colors[7] = "white"; // "img/bullet_white.png"; colors[8] = "yellow"; // "img/bullet_yellow.png"; document.getElementById("bullet").src = "img/bullet_"+colors[c]+".png"; } |
Test pagina
Alvast bedankt.
Ik zou de HTML goed opzetten (dus met een unordered list), en de kleur switchen d.m.v. het aanpassen van de class van de UL (en zo voor alle kind LI's de bullet aanpassen).
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 | <head> <script type="text/javascript"> function removeEvent(divNum){ var d = document.getElementById('myDiv'); var olddiv = document.getElementById(divNum); d.removeChild(olddiv); return false; } </script> </head> <body> <div id="myDiv"> <div id="removable"> <a href="#" onclick="removeEvent('removable');">REMOVE ME</a> </div> </div> </body> </html> |