Ik ben een absolute leek met javascript, ik jat af en toe wat scripts en snap dan net genoeg om het met wat aanpassingen te kunnen gebruiken, maar wat meer kennis zou makkelijk zijn.
Wat ik wil. Ik wil tijdens het laden van een pagina, sommige elementen (div's) iets later dan de container background div het scherm in schuiven.
Dus het menu (bv) zie je de pagina inscrollen)
Iemand hints en tips om dit te realiseren? Met welke eventhandler pak ik dit aan en is het uberhaupt mogelijk?
[ Bericht 0% gewijzigd door Swetsenegger op 29-11-2004 14:52:28 ]
vervolgs kun je een simpel moveBy script aanroepen:
iets als
quote:<script type="text/javascript">
function my_moveTo( elmN, y ) {
elm = document.getElementById( elmN )
newY = elm.offsetLeft
if (newY > y) {
newY = newY - 5
elm .style.left = newY
setTimeout( "my_moveTo( '"+elmN+"', "+y+" ) ", 250 )
}
}
function init() {
document.getElementById( 'menu' ).style.left = document.body.clientWidth
my_moveTo( 'menu', 50 )
}
window.onload = init
</script>
<style type="text/css">
DIV#menu {
position: absolute; top: 50px; left: 1000px; width: 250px; border: 1px solid red;
}
</style>
<div id="menu">menu-blah</menu>
quote:ik had inderdaad het vermoeden dat dit met de onload handler moest, echter begrijp ik je script niet helemaal. Waar roep je die functie nu aan? En waar geef ik de uiteindelijke locatie op van de div en waar de start locatie?Op maandag 29 november 2004 15:26 schreef RM-rf het volgende:
je kunt functies gewoon onload aanroepen, het onload-event vind plaats direkt na het inladen van een hele pagina (incl. alle afbeeldingen hierop)
vervolgs kun je een simpel moveBy script aanroepen:
iets als
[..]
(ja ik ben echt een noob
)Met andere woorden, om er voor te zorgen dat ik er wat van leer en de javascript behndigden niet continue blijf lastig vallen met "*zucht*... lees de fucking manual"-vragen... Kan je het even regel voor regel uitleggen wat je doet?
Thanks
verder draait het script er een beetje om dat je via getElementById elementen aanspreekt en hiervan eerst een waarde opvraagt (via object.offsetLeft) en deze vervolgens aanpast wanneer hij groter is dan de variabele y...
hierna roept de functie zichzelf via een Timeout weer aan, via setTimeout(), de functie wordt dus meermaals herhaald zolang de linkerwaarde van het element groter is dan 'y'...
in mn voorbeeldscript-script wordt in de init-functie het menu-element eerst helemaal naar rechtsbzuiten de pagina gezet, waarna de functie my_moveTo het element in stappen van 5 pixels per kwartseconde naar links beweegt.
quote:Yep, ik zie het. Ik ging uit van van links naar rechts maar jij beweegt van rechts naar links.Op maandag 29 november 2004 15:44 schreef RM-rf het volgende:
het aanroepen van een functie onload kan gewoon door bv <dody onload="functienaam()"> te doen, maar ook in het script zelf door window.onload = functienaam (waarbij je dus geen variabelen door doorgeven, daarom mijn 'init' functie).
verder draait het script er een beetje om dat je via getElementById elementen aanspreekt en hiervan eerst een waarde opvraagt (via object.offsetLeft) en deze vervolgens aanpast wanneer hij groter is dan de variabele y...
hierna roept de functie zichzelf via een Timeout weer aan, via setTimeout(), de functie wordt dus meermaals herhaald zolang de linkerwaarde van het element groter is dan 'y'...
in mn voorbeeldscript-script wordt in de init-functie het menu-element eerst helemaal naar rechtsbzuiten de pagina gezet, waarna de functie my_moveTo het element in stappen van 5 pixels per kwartseconde naar links beweegt.
De functie roep je aan zodra het document geopend wordt (window.onload) toch?
Waneer ik er nu voor wil zorgen dat je de container div al ziet en pas na een kleine pauze het element het scherm in gescrolled wordt, kan ik dit bereiken door de functie met een onload in de div zelf aan te roepen? Ik realiseer me dat dit maar een minimale pauze oplevert tov jou onload, maar het gaat me erom of ik een onload functie overal kan gebruiken zeg maar.
quote:
<html>
<head>
<title>move.layer</title>
<script type="text/javascript">
function init(){
if(document.getElementById){
obj = document.getElementById("menuDiv");
obj.style.left = 156;
}
}
function slideRight(){
if(document.getElementById){
if(parseInt(obj.style.left) < 255){
obj.style.left = parseInt(obj.style.left) + 10 + "px";
setTimeout("slideRight()",15);
}
}
}
function slideLeft(){
if(document.getElementById){
if(parseInt(obj.style.left) > 156){
obj.style.left = parseInt(obj.style.left) - 10 + "px";
setTimeout("slideLeft()",15);
}
}
}
</script>
<style type="text/css">
#menuDiv{
position:absolute;
left:156px;
top:148px;
width:110px;
text-align:right;
font-family: Arial, verdana, sans;
font-size:8pt;
z-index:2;
filter:alpha(opacity=90);-moz-opacity:0.90;
}
</style>
</head>
<body onLoad="init()" bgcolor="white">
<div id="menuDiv">
<a href="javascript:slideLeft()"><img src="image/left.gif" alt="arrow" border="0"/></a>
<a href="javascript:slideRight()"><img src="image/right.gif" alt="arrow" border="0" /></a>
<div style="position:relative; left:-17px; border-color:black; border-style:solid; border-width:1px 1px 0px 1px; background-color:#B8D3C8;">
<a href="#" onblur="slideLeft()">Wie?</a> </div>
<div style="position:relative; left:-17px; border-color:black; border-style:solid; border-width:1px 1px 0px 1px; background-color:#B8D3C8;">
<a href="#" onblur="slideLeft()">Wat?</a> </div>
<div style="position:relative; left:-17px; border-color:black; border-style:solid; border-width:1px 1px 0px 1px; background-color:#B8D3C8;">
<a href="#" onblur="slideLeft()">Hoe?</a> </div>
<div style="position:relative; left:-17px; border-color:black; border-style:solid; border-width:1px 1px 0px 1px; background-color:#B8D3C8;">
<a href="#" onblur="slideLeft()">Waarom?</a> </div>
<div style="position:relative; left:-17px; border-color:black; border-style:solid; border-width:1px; background-color:#B8D3C8;">
<a href="#" onblur="slideLeft()">Wanneer?</a> </div>
</div>
<div class="menu"><span onmouseover="slideRight()">Menu </span></div>
Dit werkt dus in zowel IE als FF. Zet ik er een doctype boven (1.0 transitional) werkt het nog steeds in IE, maar in FF (1.0) werkt de onmouseover en <a href="javascript:slideLeft()"><img src="image/left.gif" alt="arrow" border="0"/></a> niet meer
(ik had er destijds echter geen image preloaders ingebouwd, dus missch moet je m 2x kijken voor alles in je cache zit)
quote:Wow, dat is best cool, als je dat iin javascript kanOp donderdag 2 december 2004 11:57 schreef daReaper het volgende:
omdat ik zo'n hekel heb aan Flash, heb ik eens aan een vriend laten zien dat je met JavaScript bijna hetzelfde kan: http://80.60.202.155/flashzut/. Na verloop van tijd had ik er geen zin meer in, maar de basis is er
(ik had er destijds echter geen image preloaders ingebouwd, dus missch moet je m 2x kijken voor alles in je cache zit)
http://www.123swets.com/xploise/test.php (met doctype)
http://www.123swets.com/xploise/test2.php (zonder doctype)
quote:
Geen idee of ik nu poep praat, maar ik kan me voorstellen dat als er iets niet helemaal juist gaat in het stukje JavaScript, dat een doctype met strict HTML handling dan de code niet uitvoert. Een eerste blik in je code liet niet iets fout zien, maar toen bedacht ik me dus dat het heel misschien noodzakelijk is om een eventhandler netjes af te sluiten met een boolean return value voor de afhandeling van de error status. Dit zou je dus kunnen testen door de boolean mee te geven in de return van de event handler of door de return met boolean achter de aanroep van je event handler te zetten.
quote:Op donderdag 2 december 2004 15:14 schreef Lucille het volgende:
[..]
Geen idee of ik nu poep praat, maar ik kan me voorstellen dat als er iets niet helemaal juist gaat in het stukje JavaScript, dat een doctype met strict HTML handling dan de code niet uitvoert. Een eerste blik in je code liet niet iets fout zien, maar toen bedacht ik me dus dat het heel misschien noodzakelijk is om een eventhandler netjes af te sluiten met een boolean return value voor de afhandeling van de error status. Dit zou je dus kunnen testen door de boolean mee te geven in de return van de event handler of door de return met boolean achter de aanroep van je event handler te zetten.
Nu in dummie taal
Wat moet ik waar mee geven?
quote:
In de console van FF kom ik geen enkele fout tegen
<!-- -->
weghalen.
Da hoeft dus niet.
Ook je functies een boolean terug laten geven.
dus:
return true;
aan het einde van je functie.
quote:Op donderdag 2 december 2004 15:27 schreef giMoz het volgende:
in je JS ook je
<!-- -->
weghalen.
Da hoeft dus niet.
Die had ik later toegevoegd om te zien of dat verschil maakte, zal ze weer weghalen.
quote:
Ook je functies een boolean terug laten geven.
dus:
return true;
aan het einde van je functie.
Dus het wordt dit:
quote:
function init(){
if(document.getElementById){
obj = document.getElementById("menuDiv");
obj.style.left = 156;
return true;
}
}
function slideRight(){
if(document.getElementById){
if(parseInt(obj.style.left) < 255){
obj.style.left = parseInt(obj.style.left) + 10 + "px";
setTimeout("slideRight()",15);
return true;
}
}
}
function slideLeft(){
if(document.getElementById){
if(parseInt(obj.style.left) > 156){
obj.style.left = parseInt(obj.style.left) - 10 + "px";
setTimeout("slideLeft()",15);
return true;
}
}
}
?
of moet die return voor de laatste }
quote:Op donderdag 2 december 2004 15:23 schreef Swetsenegger het volgende:
Nu in dummie taal
Wat moet ik waar mee geven?
Op dit moment maak je een eventhandler op deze manier (voorbeeld, geen directe copy):
HTML deel:
onblur="doeJeDing()"
en dan in JS:
function doeJeDing() {
bla bla
return;
}
Ofwel, funcie doeJeDing() geeft geen boolean status terug (alleen een return zonder waarde) aan de eventhandler onblur. Sommige JS functies kunnen daar niet zo goed tegen en willen graag een boolean return zien (return true of return false). Dit kan je dus in de functie doeJeDing() zetten, zodat je in HTML krijgt:
onblur="return doeJeDing();"
wat ook kan is de return in je HTML stukje zetten bij de aanroep van de onblur event handler. Dat kan op twee manieren:
onblur="doeJeDing(); return false;"
Bovenste voorbeeld is het beste want dankan je in je eventhandler zowel true als false doorgeven (waardoor je netjes kan controleren of iets werkt en fouten kan afvangen), de onderste methode forceert een vaste boolean return waarde (in dit geval false), waardoor je nooit helemaal zeker bent van het resultaat in je event functie, maar er wel altijd een goede return waarde uit je eventhandler onblur komt.
Het enige waar ik nu over twijfel is of je bij succes een true of een false moet meegeven.
Ik dacht dus een false, vergelijkbaar met C programma's waarbij een 1 een foutstatus oproept en een 0 foutloos is. Maar pin me er niet op vast.
quote:Op donderdag 2 december 2004 15:42 schreef Lucille het volgende:
[..]
Op dit moment maak je een eventhandler op deze manier (voorbeeld, geen directe copy):
HTML deel:
onblur="doeJeDing()"
en dan in JS:
function doeJeDing() {
bla bla
return;
}
Ofwel, funcie doeJeDing() geeft geen boolean status terug (alleen een return zonder waarde) aan de eventhandler onblur. Sommige JS functies kunnen daar niet zo goed tegen en willen graag een boolean return zien (return true of return false). Dit kan je dus in de functie doeJeDing() zetten, zodat je in HTML krijgt:
onblur="return doeJeDing();"
wat ook kan is de return in je HTML stukje zetten bij de aanroep van de onblur event handler. Dat kan op twee manieren:
onblur="doeJeDing(); return false;"
Bovenste voorbeeld is het beste want dankan je in je eventhandler zowel true als false doorgeven (waardoor je netjes kan controleren of iets werkt en fouten kan afvangen), de onderste methode forceert een vaste boolean return waarde (in dit geval false), waardoor je nooit helemaal zeker bent van het resultaat in je event functie, maar er wel altijd een goede return waarde uit je eventhandler onblur komt.
Het enige waar ik nu over twijfel is of je bij succes een true of een false moet meegeven.
Ik dacht dus een false, vergelijkbaar met C programma's waarbij een 1 een foutstatus oproept en een 0 foutloos is. Maar pin me er niet op vast.
O...kee. Ik denk dat ik begrijp wat je bedoelt, maar waar moet ik die return nu concreet in mijn script zetten? En moet ik dan nog wat aanpassen aan het HTML deel?
onblur="return slideLeft();"
Idem voor de slideRight() functie aanroep. Ik weet dus, zoals gezegd, alleen niet of je functies dus een return true; of een return false; moeten meegeven voor het juiste resultaat. Disclaimer: ik weet zelfs niet of dit je probleem gaat oplossen.
quote:
function init(){
if(document.getElementById){
obj = document.getElementById("menuDiv");
obj.style.left "156px";
}
}
kortom, bij de init 'px' toevoegen aan de value
In dit scriptje werkt de functie op een divje met als id 'menuDiv'. Op 1 pagina kan ik die dus maar 1 keer toepassen.
Hoe verbouw ik dit nu zo dat ik die slide functie voor meerdere divs kan aanroepen?
quote:Op vrijdag 3 december 2004 22:38 schreef Swetsenegger het volgende:
Wederom een vraag over dit scriptje.
In dit scriptje werkt de functie op een divje met als id 'menuDiv'. Op 1 pagina kan ik die dus maar 1 keer toepassen.
Hoe verbouw ik dit nu zo dat ik die slide functie voor meerdere divs kan aanroepen?
function slideRight(obj){
if(document.getElementById){
if(parseInt(obj.style.left) < 255){
obj.style.left = parseInt(obj.style.left) + 10 + "px";
setTimeout("slideRight()",15);
return true;
}
sliderecht aanroepen als:
slideRight(document.getElementById("idvanDiv"));
of als je hem aanroept vanuit het object zelf uit een event:
<div onclick="slideRight(this)">...</div>
(bedoel je dat?)
quote:Op vrijdag 3 december 2004 23:04 schreef daReaper het volgende:
[..]
function slideRight(obj){
if(document.getElementById){
if(parseInt(obj.style.left) < 255){
obj.style.left = parseInt(obj.style.left) + 10 + "px";
setTimeout("slideRight()",15);
return true;
}
sliderecht aanroepen als:
slideRight(document.getElementById("idvanDiv"));
of als je hem aanroept vanuit het object zelf uit een event:
<div onclick="slideRight(this)">...</div>
(bedoel je dat?)
Thanks, ik had 'm al met logisch nadenken en googlen:
quote:
function init(name){
if(document.getElementById){
obj = document.getElementById(name);
obj.style.left = "136px";
}
}
<td onmouseover="init('menu1');slideRight()">
[ Bericht 27% gewijzigd door Swetsenegger op 03-12-2004 23:22:54 ]
(dus niet scherm resolutie, maar daadwerkelijk de hoogte in pixels van het content gedeelte van het broser scherm?
Werkt vrij cross-browser meen ik
var width = window.innerWidth;
if (!width)
width = document.body.clientWidth;
var height = window.innerHeight;
if (!height)
height = document.body.clientHeight;
[ Bericht 41% gewijzigd door daReaper op 06-12-2004 17:37:52 ]
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 | <script type="text/javascript"> function validate() { toegestaan = new Array("mid","jpg","gif") bestandsnaam = document.upload.upload.value extentie = bestandsnaam.substr(bestandsnaam.length-3,3) validate = 1 for (i = 0; i < toegestaan.length; i++){ if(extentie != toegestaan[i]){ validate = 0 } } if (validate == 0) alert("Deze extentie(" + extentie + ") is niet bruikbaar voor mobiele telefoons.") return false } </script> |
Het wordt aangeroepen door:
onsubmit="return validate()" in de <form>
Het script werkt op zich wel. Maar na de 2e keer drukken op de knop valideerd ie niet meer en submit ie dus meteen. Hoe kan ik dit oplossen?
en extensie is met een s
quote:Nee hoor. Als ik bijv een .mid file pakt dan submit ie gewoon. Bij een .exe krijg ik een error. Maar als je bijv 2x op de button klikt dan submit ie altijdOp woensdag 8 december 2004 18:13 schreef SuperRembo het volgende:
validate() returnt altijd false
en extensie is met een s
Test het anders maar. Zie sig voor link.
Maar ALS je de functie validate() een keer aanroept dan bestaat ie daarna niet meer. validate is dan namelijk 0 of 1. Week typed scipttalen, wat zijn ze toch leuk
[ Bericht 82% gewijzigd door Da_Koen op 08-12-2004 23:40:24 ]
<a href= javascript: void(null); Onclick=javascript: hier_de_functie(parameter);>
Waarom niet gewoon met <a href=javascript: hier_de_functie();> ?
quote:Op woensdag 8 december 2004 22:10 schreef Da_Koen het volgende:
Hoe kan ik het nou oplossen?
| 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 | <html> <head> <script type="text/javascript"> function validate() { var toegestaan = new Array("mid","jpg","gif"); var bestandsnaam = document.getElementById('upload').value; var parts = bestandsnaam.split('.'); var extensie = parts[parts.length-1]; var isValid = false; for (var i = 0; i < toegestaan.length; i++) { if (extensie == toegestaan[i]) { isValid = true; break; } } if (!isValid) { alert("Deze extensie(" + extensie + ") is niet bruikbaar voor mobiele telefoons."); } return isValid; } </script> </head> <body> <form enctype="multipart/form-data" method="post"> <input type="file" name="upload" id="upload"><br> <input type="submit" value="uploaden maar!" onclick="return validate()"> </form> </body> </html> |
Er stonden geen accolades bij de laatste if, zodat de functie altijd false returnde.
De functie validate veranderde zichzelf in 0 of 1, en kon daardoor dus maar 1x aangeroepen worden.
document.upload.upload.value werkt niet in Firefox. Vervangen door document.getElementById().
Ik heb de controle omgedraaid, de extensie is niet toegestaan, tenzij hij voorkomt in de lijst toegestane extensies.
Je moet op de server natuurlijk ook nog controleren of het allemaal wel klopt.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 | <?php if (isset($_GET['width']) AND isset($_GET['height'])) { // output the geometry variables echo "Screen width is: ". $_GET['width'] ."<br />\n"; echo "Screen height is: ". $_GET['height'] ."<br />\n"; } else { // pass the geometry variables // (preserve the original query string // -- post variables will need to handled differently) echo "<script language='javascript'>\n"; echo " location.href=\"${_SERVER['SCRIPT_NAME']}?${_SERVER['QUERY_STRING']}" . "&width=\" + screen.width + \"&height=\" + screen.height;\n"; echo "</script>\n"; exit(); } ?> |
Jammer dat t niet anders kan...
| 1 2 3 4 5 6 7 8 | function check(form){ if(form.naam.value != '' && form.bericht.value != ''){ form.submit(); } else{ alert('Je hebt niet alles goed ingevuld'); } } |
Hier hoort een form bij, er moet gecontroleerd worden of 2 velden zijn ingevuld, als dat zo is moet hij het form submitten. Alleen dat doet hij niet, er komt alleen "Error on page" in de statusbalk te staan.... iemand enig idee wat ik fout doe?
| 1 2 3 | function timer() { setTimeout("slideLeft()", 3000); } |
Heel simpele functie, alleen wil ik dat hij bij een onmouseover onderbroken wordt.
Hoe doe ik dat?
| 1 2 3 4 | var idle; function timer() { idle=setTimeout("slideLeft()", 3000); } |
<div onmouseout="timer();" onmouseover="cleartimeout(idle);">
Dit geeft 'idle' is undefined Maar dat snap ik niet. Ik heb idle toch buiten de functie gedefinieerd?
Met een hoofdletter T dus
quote:eh nee hoor...., in xhtml mogen er geen hoofdletters in tags, etc meer.Op dinsdag 28 december 2004 21:12 schreef _Jeffrey_ het volgende:
Ik krijg de melding 'Object wordt verwacht'. In dit geval kent ie 'cleartimeout' niet, aangezien het 'clearTimeout' is.
Met een hoofdletter T dus
onMouseOver is dus ook gewoon onmouseover en functioneert allemaal prima.
object expected krijg je wel wanneer je hier en daar een quotje teveel of te weinig hebt
Mijn scriptje werkt fantastisch op 'algemeen.php'... ware het niet dat ik al de hele avond op 'index.php' het resultaat aan het bekijken ben
quote:Javascript != XHTMLOp dinsdag 28 december 2004 21:29 schreef Swetsenegger het volgende:
[..]
eh nee hoor...., in xhtml mogen er geen hoofdletters in tags, etc meer.
onMouseOver is dus ook gewoon onmouseover en functioneert allemaal prima.
cleartimeout zal echt niet werken. clearTimeout wel.
Daarbij zijn event-handlers in (X)HTML iets anders dan in javascript.
In javascript moeten event-handlers altijd lower-case geschreven worden (een uitzondering in JS).
objectReferentie.onmouseover = function(){ alert('test'); }
werkt dus wel, maar dit niet:
objectReferentie.onMouseover = function(){ alert('test'); }
quote:Het werkt fantastischOp dinsdag 28 december 2004 21:46 schreef _Jeffrey_ het volgende:
cleartimeout zal echt niet werken. clearTimeout wel.
-edit- nope je hebt gelijk
Omdat ik op de verkeerde page zat te kijken heb ik het ongeveer 300 keer veranderd, de code is nu
| 1 2 3 4 5 6 7 8 | <script type="text/javascript"> var idle; function timer() { idle=setTimeout("slideLeft()", 750); } </script> <div onmouseout="timer();" onmouseover="clearTimeout(idle);"> |
| 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 | function getValue(varname) { // First, we load the URL into a variable var url = window.location.href; // Next, split the url by the ? var qparts = url.split("?"); // Check that there is a querystring, return "" if not if (qparts.length == 0) { var niets='uk.txt'; return niets; } // Then find the querystring, everything after the ? var query = qparts[1]; // Split the query string into variables (separates by &s) var vars = query.split("&"); // Initialize the value with "" as default var value = ""; // Iterate through vars, checking each one for varname for (i=0;i<vars.length;i++) { // Split the variable by =, which splits name and value var parts = vars[i].split("="); // Check if the correct variable if (parts[0] == varname) { // Load value into variable value = parts[1]; // End the loop break; } } // Convert escape codes value = unescape(value); // Return the value return value; } var file = getValue("link"); |
Maar dit gedeelte
| 1 2 3 4 5 6 7 8 9 | // Next, split the url by the ? var qparts = url.split("?"); // Check that there is a querystring, return "" if not if (qparts.length == 0) { var niets='uk.txt'; return niets; } |
Werkt niet.
Dit zou dus bij en url ZONDER get info 'uk.txt' terug moeten geven, maar dat gebeurt niet.
Waar ga ik fout?
Verder geeft window.location.search meteen de seach string. Die begint alleen wel met een '?', die moet je er zelf afknippen.
[ Bericht 22% gewijzigd door SuperRembo op 30-12-2004 18:30:06 ]
quote:Maar in dit geval staat er dus helemaal geen ? in de url...Op donderdag 30 december 2004 18:24 schreef SuperRembo het volgende:
'foo'.split('?').length geeft 1
Verder geeft window.location.search meteen de seach string. Die begint alleen wel met een '?', die moet je er zelf afknippen.
dus 'index.php?taal=uk.txt' werkt prima, maar bij index.php verwacht ik dus 'uk.txt' terug en dat gebeurt dus niet.
Aangezien in het laatste geval er niet te splitten valt op ? zou logischerwijs qpart==0 toch waar zijn?
quote:Op donderdag 30 december 2004 19:05 schreef SuperRembo het volgende:
Nee. Als je 'foo' split op '?' dan krijg je een array met 1 element, namelijk 'foo'.
Ik heb me de tering gezocht
| 1 | <script type="text/javascript">document.write('<a class="twee" href="status1.htm?link=' + language + '" target="iframe">' + (showText(0)) +'</a>')</script> |
Misschien staat er een layer over de link heen ofzo? heb je een online voorbeeldje?
Waarom werkt dit allemaal geweldig in Gecko en IE, maar niet in Opera?
| 1 2 3 4 5 6 7 8 9 10 11 | function Add() { var optgroup = document.getElementById('optgroup'); var select = document.getElementById('select'); element = document.createElement("option"); element.setAttribute("value", 1); element.innerHTML = "Testing"; optgroup.appendChild(element); document.getElementById('h').value = optgroup.getElementsByTagName("option").length; } |
quote:Nee, 't is intranetOp vrijdag 31 december 2004 16:02 schreef _Jeffrey_ het volgende:
Hier in FF 1.0 werkt het gewoon goed.
Misschien staat er een layer over de link heen ofzo? heb je een online voorbeeldje?
Layer, hmz zou kunnen het staat in een container, welke 2 divs bevat, waarvan 1 relative.
Maandag kan ik pas weer kijken ... Ik weet nu in ieder geval dat de javascript goed is
quote:Het lijkt een Opera bug te zijn. Zelfs als je de innerHTML van het hele select element opvraagt nadat het option element geplaatst is, lijkt het gewoon op de goede plaats in het select element te staan, maar het wordt gewoon niet zichtbaar. Option elementen toevoegen aan het select element werkt wel goedOp vrijdag 31 december 2004 16:25 schreef Arjan321 het volgende:
Zie http://www.n321.com/poc.html
Waarom werkt dit allemaal geweldig in Gecko en IE, maar niet in Opera?
Je zou een bug report bij Opera in kunnen dienen, misschien dat je daar andere ook mee helpt
Ik dacht het op te kunnen lossen door de innerHTML van het select element te vernieuwen door "select.innerHTML = select.innerHTML" te gebruiken. Maar dat slikt Opera niet (dat gebeuren er hele vage dingen). Soms crash ie zelfs
maar daar ben ik dan wel mooi klaar mee, want dit zou ik toch wel graag even werkende willen hebben in Opera
[ Bericht 0% gewijzigd door _Jeffrey_ op 31-12-2004 20:04:11 ]
De code voor de mensen die dit toch nooit zullen tegenkomen:
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 | function Add() { var optgroup = document.getElementById('optgroup'); var select = document.getElementById('select'); var container = document.getElementById('containeri'); element = document.createElement("option"); element.setAttribute("value", 1); element.innerHTML = "Testing"; optgroup.appendChild(element); if (window.opera) { clone = select.cloneNode(true); container.removeChild(select); container.appendChild(clone); } } |
quote:je kunt wel een script maken dat alle tekst-waardes omzet naar hun hex-karakter (via de Stringmethode.toString(16))Op donderdag 13 januari 2005 17:08 schreef Swetsenegger het volgende:
Is er een javascript equivalent van php's htmlentities?
| 1 | <&bléüh> |
wordt dan
| 1 | <&bléüh> |
dmv code als bv:
| 1 2 3 4 5 6 7 8 9 10 11 | var my_variabele = '<&bléüh>' var string_output='' var temp_var for( var i=0; i < my_variabele.length; i++ ) { temp_var = my_variabele.charAt( i ); temp_var = temp_var.charCodeAt(0); temp_var = '&#'+ temp_var.toString(16) + ';' string_output += temp_var; } return string_output |
Maar dat kan ook een onpraktische situatie zijn, als het voor een CMS is, is het eerder aan te raden om sowieso alle input via html_entities te laten gaan en gebruikers te verbieden zelf direkt html in te voeren, hooguit misschien bepaalde standaard-waardes er voorheen uit te filteren, daarmee behoud je een betere controle over de input van gebruikers
(juist binnen een CMS is het een zeker risico om mensen volledig het recht te geven direkt HTML in te voeren)
[ Bericht 2% gewijzigd door RM-rf op 13-01-2005 18:02:51 ]
quote:helaas is het een embedded systeem waarbij er geen ruimte is voor php of ander serverside oplossingen. Alleen client side scripting.Op donderdag 13 januari 2005 17:47 schreef RM-rf het volgende:
[..]
je kunt wel een script maken dat alle tekst-waardes omzet naar hun hex-karakter (via de Stringmethode.toString(16))
[ code verwijderd ]
wordt dan
[ code verwijderd ]
dmv code als bv:
[ code verwijderd ]
Maar dat kan ook een onpraktische situatie zijn, als het voor een CMS is, is het eerder aan te raden om sowieso alle input via html_entities te laten gaan en gebruikers te verbieden zelf direkt html in te voeren, hooguit misschien bepaalde standaard-waardes er voorheen uit te filteren, daarmee behoud je een betere controle over de input van gebruikers
(juist binnen een CMS is het een zeker risico om mensen volledig het recht te geven direkt HTML in te voeren)
Het betreft ook geen invoer, maar een fixed tekst van ongeveer 400 regels. Dus zet ik nu maar handmatig alle ö, ü, è, î, ñ om naar de entity waarden
... voor elke taal | 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 | function cloack(waarde) { if(waarde == "yes") { document.getElementById('layer1').style.visibility = 'hidden'; document.getElementById('layer1').style.display = 'None'; document.getElementById('layer2').style.visibility = 'visible'; document.getElementById('layer2').style.display = 'Block'; document.getElementById('command').style.display = 'None'; } else if(waarde == "no") { document.getElementById('layer2').style.visibility = 'hidden'; document.getElementById('layer2').style.display = 'None'; document.getElementById('layer1').style.visibility = 'visible'; document.getElementById('layer1').style.display = 'Block'; document.getElementById('command').style.display = 'None'; } else { document.getElementById('layer2').style.visibility = 'hidden'; document.getElementById('layer2').style.display = 'None'; document.getElementById('layer1').style.visibility = 'hidden'; document.getElementById('layer1').style.display = 'None'; document.getElementById('command').style.display = 'None'; } } |
is er een manier om dit efficienter te doen??? of niet?
ik gebruik een if, else if, else script omdat ik in de dropdown box 3 waardes heb: ja, nee en blank (de standaard waarde)
quote:Op vrijdag 14 januari 2005 23:39 schreef mschol het volgende:
vraagje aan de JS experts:
[ code verwijderd ]
is er een manier om dit efficienter te doen??? of niet?
ik gebruik een if, else if, else script omdat ik in de dropdown box 3 waardes heb: ja, nee en blank (de standaard waarde)
| 1 2 3 4 5 6 7 | function cloack(waarde) { document.getElementById("layer1").style.visibility = waarde == "yes" ? 'visible' : "hidden"; document.getElementById("layer1").style.display = waarde == "yes" ? 'block' : "none"; document.getElementById("layer2").style.visibility = waarde == "no" ? 'visible' : "hidden"; document.getElementById("layer2").style.display = waarde == "no" ? 'block' : "none"; document.getElementById('command').style.display = 'None'; } |
probeer het zo eens (niet getest)
En cloak is zonder ck.
| 1 2 3 4 5 | function cloak(waarde) { document.getElementById('layer1').style.display = waarde == 'yes' ? 'block' : 'none'; document.getElementById('layer2').style.display = waarde == 'no' ? 'block' : 'none'; document.getElementById('command').style.display = 'none'; } |
| 1 2 3 4 5 6 7 | <input type="checkbox" name="en_aanvang" checked onClick="Toggle('agenda_nieuw_aanvang')"> Aanvang: <input type="text" name="agenda_nieuw_aanvang" maxlength="10"> uur<br/> <input type="checkbox" name="en_prijs" checked onClick="Toggle('agenda_nieuw_prijs')"> Prijs: ¤<input type="text" name="agenda_nieuw_prijs" maxlength="5"><br/> |
Ugh, mijn schrale beetje javascriptkennis laat me weer in de steek. Wat ik wil is op zich niet zo moeilijk leek me. Als op de checkboxen 'en_aanvang' of 'en_prijs' geklikt wordt, wordt respectievelijk 'agenda_nieuw_aanvang' disabled/enabled, of 'agenda_nieuw_prijs' disabled/enabled. Ik heb echter meerdere pogingen gedaan om de "Toggle"-functie te schrijven, maar ik kom er niet uit. En het moet zo makkelijk zijn. Kan iemand me even uit de brand helpen?
Dit werkt iig niet
| 1 2 3 4 5 6 7 8 9 | <script language="Javascript"> function Toggle(elID) { if(document.getElementById(elID).style.disabled == true) { document.getElementById(elID).style.disabled = false; } else { document.getElementById(elID).style.disabled = true; } } </script> |
| 1 | document.getElementById(elID).disabled |
quote:Op vrijdag 21 januari 2005 16:32 schreef Heliospan het volgende:
[ code verwijderd ]
Ugh, mijn schrale beetje javascriptkennis laat me weer in de steek. Wat ik wil is op zich niet zo moeilijk leek me. Als op de checkboxen 'en_aanvang' of 'en_prijs' geklikt wordt, wordt respectievelijk 'agenda_nieuw_aanvang' disabled/enabled, of 'agenda_nieuw_prijs' disabled/enabled. Ik heb echter meerdere pogingen gedaan om de "Toggle"-functie te schrijven, maar ik kom er niet uit. En het moet zo makkelijk zijn. Kan iemand me even uit de brand helpen?
Dit werkt iig niet
[ code verwijderd ]
| 1 2 3 | <script language="Javascript"> document.getElementById(elID).disabled = document.getElementById(elID).disabled == true ? false : true; </script> |
Volgens mij is "disabled" geen CSS property, maar hoort het bij het element direct. Probeer het zo eens (niet getest)
Bedankt beide!| 1 2 3 4 5 6 7 8 9 | function Toggle(elID) { if(document.getElementById(elID).disabled == true) { document.getElementById(elID).disabled = false; document.getElementById(elID).style.backgroundColor = "#ffffff"; } else { document.getElementById(elID).disabled = true; document.getElementById(elID).style.backgroundColor = "#aaaaaa"; } } |
Dit werkt prima in IE. Maar in Firefox gebeurt er helemaal niets, niet disabled en geen andere achtergrondkleur. Werkt Firefox niet met getElementById ofzo?
Jouw code werkt bij mij in FF prima met een input text element. Maar zo zou ik 't doen (wat overzichtelijker, makkelijker te debuggen en uit te breiden)
| 1 2 3 4 5 6 7 8 9 10 11 | function Toggle(id) { var el = document.getElementById(id); if (!el) return; if (el.disabled) { el.disabled = false; el.style.backgroundColor = '#fff'; } else { el.disabled = true; el.style.backgroundColor = '#aaa'; } } |
Ik zie vast iets over het hoofd
-edit-
Sjongejonge. GetElementByID... Internet Explorer had het fout moeten weergeven, omdat ik alleen een name="bladiebla" had, maar dat wordt in IE ook geaccepteerd als ID blijkbaar. Maar goed, id="bladiebla" toegevoegd en het werkt
quote:Inderdaad een stuk duidelijker dan "Object Expected", wat IE 9 op de 10x zegtOp vrijdag 21 januari 2005 19:41 schreef Arjan321 het volgende:
Moet wel even zeggen dat FireFox een prachtige javascript console heeft, die, zolang je niets al te vreemd doet, een foutmelding geeft wat er fout gaat in het script (Tools -> Javascript Console)
Javascript Console zit overigens niet bij de minimale installatie, let daar even op.
[ Bericht 1% gewijzigd door daReaper op 21-01-2005 19:58:53 ]
De onmouseover doet het in FF ook probleemloos, maar bij de onmouseout wordt bij ELKE link welke een onmouseover heeft uitgevoerd, de onmouseout uitgevoerd.
| 1 2 3 4 5 6 7 8 9 10 | <body> <img name="home" border="0" src="image/static.gif" width="14px" height="14px"> <a href="home.htm" onmouseover="document.home.src='image/on.gif';playSound(0)" onmouseout="document.home.src='image/off.gif'">home</a><br /> <img name="occassion" border="0" src="image/static.gif" width="14px" height="14px"> <a href="occassion.htm" onmouseover="document.occassion.src='image/on.gif';playSound(0)" onmouseout="document.occassion.src='image/off.gif'">occassion</a><br /> <img name="aanbieding" border="0" src="image/static.gif" width="14px" height="14px"> <a href="aanbieding.htm" onmouseover="document.aanbieding.src='image/on.gif';playSound(0)" onmouseout="document.aanbieding.src='image/off.gif'">aanbieding</a><br /> <img name="bestellen" align=middle src="image/static.gif" width="14px" height="14px"> <a href="bestellen.htm" onmouseover="document.bestellen.src='image/on.gif';playSound(0)" onmouseout="document.bestellen.src='image/off.gif'">bestellen</a><br /> </body> |
Beetje vaag verhaal, maar dit maakt het misschien duidelijker.
Ander probleem, het volgende script zou 'crossbrowser' wavjes moeten laten horen bij events. In IE doet hij het, in gecko niet.
| 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 | var aySound = new Array(); aySound[0] = "image/rollover01.wav"; document.write('<BGSOUND ID="auIEContainer">') IE = (navigator.appVersion.indexOf("MSIE")!=-1 && document.all)? 1:0; NS = (navigator.appName=="Netscape" && navigator.plugins["LiveAudio"])? 1:0; ver4 = IE||NS? 1:0; onload=auPreload; function auPreload() { if (!ver4) return; if (NS) auEmb = new Layer(0,window); else { Str = "<DIV ID='auEmb' STYLE='position:absolute;'></DIV>"; document.body.insertAdjacentHTML("BeforeEnd",Str); } var Str = ''; for (i=0;i<aySound.length;i++) Str += "<EMBED SRC='"+aySound[i]+"' AUTOSTART='FALSE' HIDDEN='TRUE'>" if (IE) auEmb.innerHTML = Str; else { auEmb.document.open(); auEmb.document.write(Str); auEmb.document.close(); } auCon = IE? document.all.auIEContainer:auEmb; auCon.control = auCtrl; } function auCtrl(whSound,play) { if (IE) this.src = play? aySound[whSound]:''; else eval("this.document.embeds[whSound]." + (play? "play()":"stop()")) } function playSound(whSound) { if (window.auCon) auCon.control(whSound,true); } function stopSound(whSound) { if (window.auCon) auCon.control(whSound,false); } |
Iemand een idee?
[ Bericht 1% gewijzigd door Swetsenegger op 22-01-2005 19:01:15 ]
Gefeliciteerd met je vondst
quote:Ja die.Op zondag 23 januari 2005 12:58 schreef Arjan321 het volgende:
https://bugzilla.mozilla.org/show_bug.cgi?id=266210 dus hè
De simpelste workaround is je off.gif vervangen door een statisch gifje.
In firefox speelt ie 1x de animatie af, daarna is het plaatje voorbij geweest en doet ie het dus in een schok.. de code:
| 1 2 3 | <span style="background-image: url('image/static.gif');background-repeat: no-repeat;padding-left: 15px;"> <a href="#" onmouseover="this.parentNode.style.backgroundImage='url(\'image/on.gif\')'" onmouseout="this.parentNode.style.backgroundImage='url(\'image/off.gif\')'">home</a> </span> |
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 | <html> <head> <title></title> <style type="text/css"> a { padding-left: 20px; background-image: url('off.gif'); background-repeat: no-repeat; background-position: 0% 50%; } a:hover { background-image: url('on.gif'); } </style> </head> <body> <a href="">Foo</a><br> <a href="">Bar</a><br> <a href="">Baz</a><br> </body> </html> |
quote:Dat is godverdomme al de tweede keer dat ik tegen een gecko bug aanloop en workarounds voor MOZILLA moet verzinnen (in plaats van voor IE)Op zondag 23 januari 2005 11:47 schreef SuperRembo het volgende:
Met niet-animated gifjes werkt het wel goed. Het is dus een bug in FireFox
Gefeliciteerd met je vondst
(de vorige is het scrollwheel in overflow divs. Ondertussen opgelost in nightly's)Op google vind ik nietecht een oplossing
quote:nee, dan zou je eerder met SVG (Scalable Vector Graphics, een W3C-standaard voor vector-gebaseerde afbeeldingen, in markup format) moeten werken, deze kent transform-attributen met een rotate-functieOp zondag 23 januari 2005 19:44 schreef Swetsenegger het volgende:
Andere vraag. Bestaat er een DHTML mogelijkheid om div's te roteren?
Op google vind ik nietecht een oplossing
Mozilla kent wel de mogelijkheid om zowel XHTML, MathML en SVG te combineren en door elkaar te gebruiken
maar explorer ondersteund dit niet, explorer kent wel de mogelijkheid om WML (een proprietair MS-formaat voor vectoren) of proprietaire css-filters toe te passen, die teksten laten roteren:
http://msdn.microsoft.com(...)e/filters/matrix.asp
maar een cross-browser oplossing is er niet.
quote:Dit vond ik op google inderdaad.Op maandag 24 januari 2005 14:16 schreef RM-rf het volgende:
[..]
nee, dan zou je eerder met SVG (Scalable Vector Graphics, een W3C-standaard voor vector-gebaseerde afbeeldingen, in markup format) moeten werken, deze kent transform-attributen met een rotate-functie
Mozilla kent wel de mogelijkheid om zowel XHTML, MathML en SVG te combineren en door elkaar te gebruiken
maar explorer ondersteund dit niet, explorer kent wel de mogelijkheid om WML (een proprietair MS-formaat voor vectoren) of proprietaire css-filters toe te passen, die teksten laten roteren:
http://msdn.microsoft.com(...)e/filters/matrix.asp
maar een cross-browser oplossing is er niet.
Iemand nog een idee over deze? Werkt niet onder gecko
quote:Op zaterdag 22 januari 2005 18:46 schreef Swetsenegger het volgende:Ander probleem, het volgende script zou 'crossbrowser' wavjes moeten laten horen bij events. In IE doet hij het, in gecko niet.
[ code verwijderd ]
Iemand een idee?
quote:Het script dat je postte is uit de Netscape4 tijd (navigatoir.plugins['LiveAudio] en werken met New Layer()-methods, dat is allemaal document.layers troep)Op maandag 24 januari 2005 15:32 schreef Swetsenegger het volgende:
Iemand nog een idee over deze? Werkt niet onder gecko
[..]
volgens mij kun je gewoonweg de explorer methode toepassen, ook voor gecko en andere browsers
quote:Ok, ik vond het al een lang en onduidelijk script voor zoites simpelsOp maandag 24 januari 2005 15:40 schreef RM-rf het volgende:
[..]
Het script dat je postte is uit de Netscape4 tijd (navigatoir.plugins['LiveAudio] en werken met New Layer()-methods, dat is allemaal document.layers troep)
volgens mij kun je gewoonweg de explorer methode toepassen, ook voor gecko en andere browsers
quote:Ja background sound is irritant, maar een heel zacht simpel piepje bij het aanwijzen van een knop vind ik wel toegevoegde waarde.Op maandag 24 januari 2005 16:06 schreef Arjan321 het volgende:
bgsound is iets dat (gelukkig) alleen IE ondersteund.. Anders zou je iets als flash moeten gebruiken als je crossbrowser geluidjes wilt afspelen bij onmouseover..
Maar crossbrowser met een javascript zal dat niet gaan lukken waarschijnlijk....
| 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 | <html> <body topmargin=0 leftmargin=0> <script language="javascript"> function preview() { document.getElementById('preview').innerHTML = '<font size="' + document.getElementById('size').value + '" face="' + document.getElementById('font').value + '">Preview</font>'; } </script> <table border="0"> <tr><td>Font</td><td>Size</td><td> </td></tr> <tr><td><select id="font" name="font" size="4" onClick="preview();"> <option value="Arial">Arial</option> <option value="Helvetica">Helvetica</option> <option value="Times New Roman">Times New Roman</option> <option value="Verdana">Verdana</option></select></td> <td><select id="size" name="size" size="4" onClick="preview();"> <option value="8">8</option><option value="10">10</option> <option value="12">12</option><option value="14">14</option> <option value="18">18</option><option value="24">24</option> <option value="36">36</option></select></td> <td> </td> </tr> <tr><td colspan="3" style="height: 30px;" id="preview">Preview</td> </tr> </table> |
ps enters ivm verneuken layout
quote:Waarom doe je het in godsnaam met innerHTML en een Font elementOp donderdag 27 januari 2005 01:40 schreef Chandler het volgende:
Ik zit met het volgende, het het volgende scriptje probeer ik een font en grootte selecteren en weer te geven in de daarvoor bestemde 'box' met id.. nu is het probleem dat ik maar een malig de grootte van het font kan veranderen, daarna kan ik alles proberen maar krijg ik niet de juiste size er uit. Iemand die de fout ziet?
[ code verwijderd ]
ps enters ivm verneuken layout
sowieso wordt <font> tegenwoordig niet meer gebruit, dus gooi dat maar uit je hoofd. Dat soort dingen bepaal je tegenwoordig met CSS:
| 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 | <html> <body topmargin=0 leftmargin=0> <script language="javascript"> function preview() { document.getElementById('preview').style.fontSize = document.getElementById('size').value + "pt"; } </script> <table border="0"> <tr><td>Font</td><td>Size</td><td> </td></tr> <tr><td><select id="font" name="font" size="4" onClick="preview();"> <option value="Arial">Arial</option> <option value="Helvetica">Helvetica</option> <option value="Times New Roman">Times New Roman</option> <option value="Verdana">Verdana</option></select></td> <td><select id="size" name="size" size="4" onClick="preview();"> <option value="8">8</option><option value="10">10</option> <option value="12">12</option><option value="14">14</option> <option value="18">18</option><option value="24">24</option> <option value="36">36</option></select></td> <td> </td> </tr> <tr><td colspan="3" style="height: 30px;" id="preview">Preview</td> </tr> </table> |
Succes
quote:alle layout-opties behoren toe aan het 'style'-object:Op donderdag 27 januari 2005 10:32 schreef Chandler het volgende:
ok, maar nu pas je alleen de 'fontsize' aann, ik neem aan dan je ook de font op die manier kan aanpassen?
om het font te veranderen kun je de fontFamily-propertie gebruiken
voor alle mogelijke 'styles', zie bv de documentatie op de MSDN-site (de geeft natuurlijk enkel de mogelijkheden in explorer, welke wel een stuk beperkter zijn, gezien de slechte CSS-ondersteuning: http://msdn.microsoft.com(...)bjects/obj_style.asp of de DOM-Style-lijst op de mozilla-site: http://www.mozilla.org/do(...)e_ref18.html#1002335 )
[ Bericht 8% gewijzigd door RM-rf op 27-01-2005 10:48:00 ]
| 1 2 3 4 5 | totaalArray = new Array(4) totaalArray[1] = '2,00'; totaalArray[2] = '4,45'; totaalArray[3] = '3,23'; totaalArray[4] = '6,53'; |
Nu wil ik de waarden uit deze array bij elkaar optellen, met welke functie doe ik dat?
Dus een forloopje of while loopje gebruiken
| 1 2 3 4 | var totaal = 0; for (var i = 0; i < totaalArray.length; i++) { totaal+= totaalArray[i]; } |
Een array begint trouwens met sleutel/index 0, niet 1..
Ik heb een form met meerdere invulvelden en meerdere submits.
Nu wil ik bij bepaalde invoervelden de focus op een specifieke submit button krijgen.
Ik heb iets over focus() gelezen, maar hoe doe ik dit precies? Moet ik de invulvelden een ID meegeven of iets dergelijks?
misschien ter verduidelijking.
Wanneer ik een term in een bepaald veld invul, moet bij een enter niet submitknop 1 actief zijn, maar submitknop 2.
[ Bericht 18% gewijzigd door Swetsenegger op 28-01-2005 11:25:27 ]
, nog een klein vraagje. Weten jullie welke font standaard op eingelijk alle windows/unix systemen te vinden zijn? en gebruikt kunnen worden voor internet toepassingen (web? etc?)quote:Je kan bijvoorbeeld zoiets doen:Op vrijdag 28 januari 2005 10:25 schreef Swetsenegger het volgende:
Javascript helden, wederom een kleine vraag van mijn kant.
Ik heb een form met meerdere invulvelden en meerdere submits.
Nu wil ik bij bepaalde invoervelden de focus op een specifieke submit button krijgen.
Ik heb iets over focus() gelezen, maar hoe doe ik dit precies? Moet ik de invulvelden een ID meegeven of iets dergelijks?
misschien ter verduidelijking.
Wanneer ik een term in een bepaald veld invul, moet bij een enter niet submitknop 1 actief zijn, maar submitknop 2.
| 1 2 3 4 5 6 7 8 | <form> <input type="text" onchange="this.form.submit1.focus();" /> <input type="text" onchange="this.form.submit2.focus();" /> <input type="text" onchange="this.form.submit3.focus();" /> <input type="submit" name="submit1" value="Submit1" /> <input type="submit" name="submit2" value="Submit2" /> <input type="submit" name="submit3" value="Submit3" /> </form> |
quote:Als je als laatste element in de font-family, ofwel serif, danwel sans-serif geeft, werkt het op zich in elke browser natuurlijk (serif, zijn lettertypen met een aanhangseltje aan de pootjes van de letters)Op vrijdag 28 januari 2005 11:36 schreef Chandler het volgende:
tnx daReaper en RM-rf
quote:Op vrijdag 28 januari 2005 10:25 schreef Swetsenegger het volgende:
Javascript helden, wederom een kleine vraag van mijn kant.
Ik heb een form met meerdere invulvelden en meerdere submits.
Nu wil ik bij bepaalde invoervelden de focus op een specifieke submit button krijgen.
Ik heb iets over focus() gelezen, maar hoe doe ik dit precies? Moet ik de invulvelden een ID meegeven of iets dergelijks?
misschien ter verduidelijking.
Wanneer ik een term in een bepaald veld invul, moet bij een enter niet submitknop 1 actief zijn, maar submitknop 2.
| 1 2 3 4 5 6 | <form> <input type="submit" id="nummer1"> <input type="text" onblur="document.getElementById('nummer1').focus()"> <input type="text" onblur="document.getElementById('nummer2').focus()"> <input type="submit" id="nummer2"> </form> |
Probeer dat maar
Dus een unieke ID aan de submit knoppen, en dan focussen als de input geblurd ( O_O ) wordt..quote:Gebruik dan de crossbrowser versie:Op vrijdag 28 januari 2005 12:04 schreef Arjan321 het volgende:
[..]
[ code verwijderd ]
Probeer dat maar
| 1 2 3 4 5 6 | <form> <input type="submit" id="nummer1" name="submit1" /> <input type="text" onblur="this.form.submit1.focus();" /> <input type="text" onblur="this.form.submit2.focus();" /> <input type="submit" id="nummer2" name="submit2" /> </form> |
quote:Nee dat bedoel ik niet geheel, meer in de zin welke font's wel of niet aanwezig zijn op de meeste systemen.Op vrijdag 28 januari 2005 12:03 schreef Roönaän het volgende:
[..]
Als je als laatste element in de font-family, ofwel serif, danwel sans-serif geeft, werkt het op zich in elke browser natuurlijk (serif, zijn lettertypen met een aanhangseltje aan de pootjes van de letters)
Ik heb nu in mijn javascriptje de volgende mogelijkheden.
| 1 2 3 4 | var fonts = new Array("Arial", "Helvetica", "Times New Roman", "Verdana"); |
Maar zijn er meer mogelijkheden?
Jullie oplossingen werken, wanneer ik met een tab verspring bv. maar wanneer ik wat in het veld invul en 'enter' druk wordt nog steeds submit knop 1 gebruikt ipv submitknop 2.
quote:Bedankt!Op vrijdag 28 januari 2005 13:14 schreef Roönaän het volgende:
Je kan nog op zich onkeypress="this.onchange();" toevoegen.
quote:Het is crossbrowser.. het zal wellicht niet werken in de antieke browsers (versies <= 5), maar dat is niet mijn foutOp vrijdag 28 januari 2005 12:06 schreef Roönaän het volgende:
[..]
Gebruik dan de crossbrowser versie:
[ code verwijderd ]
enzo... nu wil ik weten of het ook mogelijk is om vanuit het nieuwe scherm functies te benutten van onderliggende code? dus vanuit de opener? zo ja is er referentie materiaal? ik heb helaas niets kunnen vinden...
@Chandler: window.opener.functienaam();
Mijn kleine UBB Editor is aardig op weg naar een mini successie voor de ikke, mijn eerst geschreven UBB editor (zelf dan wel te verstaan hé ) met hulp van jullie experts! | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 | function calc_totaal(prods) { var prods = eval(prods); var totaalArray = new Array(prods) for (var aantal=1; aantal<=prods; aantal++) { totaalArray[aantal] = document.getElementById('bedrag'+eval(aantal)).value; } var totaal = 0; for (var i = 0; i <= totaalArray.length; i++) { totaal+= totaalArray[i]; } } |
maar dat wil niet werken, als ik hem echo met document.write, komt er een nogal vaag getal uit:
NaN1.999.990.89undefined
weet dat het iets te maken heeft met Not a number, maar wat....
Iemand die hier wat op weet?
nou even door de w3c validator heen gehaal en wat kleine foutjes er uit gehaald maar blijft zelfs op mijn javascript hangen
http://validator.w3.org/check?uri=http%3A%2F%2Fupload.bruggema.nl%2Ffiles%2Findex.html&charset=%28detect+automatically%29&doctype=%28detect+automatically%29
En ik heb wat anders.
Ik heb de volgende functie
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 | function getSelected() { theSelection = document.selection.createRange().text; if (!theSelection) { return false; } else if (document.selection.createRange().parentElement().tagName != 'TEXTAREA') { return false; } else { return theSelection; } } |
vervangen door
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 | function getSelected() { // http://www.quirksmode.org/js/selected.html if (window.getSelection) { return window.getSelection(); } else if (document.getSelection) { return document.getSelection(); } else if (document.selection) { return document.selection.createRange().text; } else return; } |
deze werkt beter met MOZILLA maar zit nu nog steeds met de volgende functie die problemen geeft.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 | function insert(start, end) { theSelection = getSelected(); if (!theSelection) { document.forms[0].elements['text'].value += start + end; } else { document.selection.createRange().text = start + theSelection + end; } // document.forms[0].elements['text'].value += start + end; } |
deze is echter alleen IE only
en dit zou ook moeten kunnen werken in Mozilla (hoop ik, iemand een suggestie?) en niemand reagaert... 
Heb je voor die selection al gekeken hoe 't bij de (ex-)buren werkt?
ennuh ik ben daar niet gewenst b.t.w quote:Je eerste loop gaat van 1 t/m prod, je tweede loop gaat van 0 t/m prod.Op vrijdag 28 januari 2005 16:37 schreef markiemark het volgende:
nog steeds even dat van mn vorige post... over het optellen van waarden in een array, ik denk dat ik er aardig uit ben gekomen na de post van Arjan 321, maar het werkt nog steeds niet zoals ik zou willen... ik heb nu dit:
[ code verwijderd ]
maar dat wil niet werken, als ik hem echo met document.write, komt er een nogal vaag getal uit:
NaN1.999.990.89undefined
weet dat het iets te maken heeft met Not a number, maar wat....
Dat verklaart de eerste NaN.
Ik denk dat het laatse element niet bastaat en dat je daarom die laatste undefined krijgt.
quote:Beetje vreemde error die je in je editor in FF krijgt.Op zaterdag 29 januari 2005 21:19 schreef Chandler het volgende:
haha true true SuperRembo, maar nog niet de crossbrouwser oplossing
"ShowPanel is undefinded" terwijl er toch echt een "function ShowPanel(...)" bestaat. Ik zie ook niet dat ie ergens overschreven wordt
| 1 2 3 | Error: document.getElementById("fontSize") has no properties Source File: http://localhost/littleeditor/editor# Line: 156 |
en lijn 156 =
| 1 2 3 4 5 6 | <?php 156 if (document.getElementById('fontSize').value) 157 { 158 document.getElementById('previewFont').style.fontSize = document.getElementById('fontSize').value + "pt"; 159 } ?> |
maar mijn optel som werkt nog steeds niet... 
volgens mij heb ik de array niet eens nodig, en kan ik het af met de for loop, ik doe het nu dus op de volgende manier, maar werken ho maar... :(| 1 2 3 4 5 6 7 8 9 10 11 | function calc_totaal(prods) { var prods = eval(prods); var totaal = eval(0); for (var i=1; i<=prods; i++) { totaal += eval(document.getElementById('bedrag'+prods).value); } document.write(totaal); } |
hij write een heel vaag cijfer op het scherm wat nergens op slaat... iemand een idee
wat een simpele eingelijk quote:ja idd, het werkt nu, TE simpel eigenlijk....
(bestaande source 
)ik doe het nu hier mee
| 1 | var totaal = eval((totaal * 100) / 100); |
markiemark toch , dat had je zelfs uit de referentie kunne halen quote:s = s.substring(0, index) + s.substring(index+length, s.length);Op zondag 30 januari 2005 15:36 schreef Chandler het volgende:
Weet iemand hoe ik een gedeelte van een string kan verwijderen (tegebruiken voor CUT), ik heb copy en paste reeds werkend voor IE & Moz
toch?
ik wil met getSelection(); de text ophalen en deze verwijderen, zoals in php mogelijk is met str_replace(van, naar, $str);
| 1 2 3 | var str = document.forms['textform'].elements['text'].value; str.replace('/' + getSelected() + '/g', 'ttt'); document.forms['textform'].elements['text'].value = str; |
dit werkt helaas niet
krijg ook geen foutmelding en ttt is als voorbeeld.. en dat is ook niet zo gemakkelijk quote:Moet je heel even quietguy aanschieten, daar had ik soortgelijks een tijd terug voor uitgezocht, weet alleen niet meer waar, en de search is niet al te behulpzaam moet ik zeggen..Op zondag 30 januari 2005 20:39 schreef Chandler het volgende:
idd daar heb je gelijk... maar dan moet ik uitvinden waar selected text begint en eindigd
quote:ehm, php en javascript hebben niks met elkaar gemeen, vergeet dat alsjeblieft.Op zondag 30 januari 2005 16:02 schreef markiemark het volgende:
is het round? weet wel dat ie in php werkt, maar ik zocht in mn digitale gedo... kochte php bible (stond op cdtje bij het boek ;-) en daar vond ik niks met round, neem aan dat ie hetzelfde werkt als bij php? ik probeer even
javascript (officieel ECMA-script, naar de ECMA-262-standaard: http://www.ecma-internati(...)ecma-st/ECMA-262.pdf ) is een object-georienteerde taal :
hierin kan je werken met verschillende objecten, neem bv het standard Date-object, of in jouw geval het Math-object:
methoden als Math.round() of Math.ceil() bieden je de mogelijkheid om af te ronden, eventueel kun je echter ook in dit geval parseFloat( intergerVariabele, 2) gebruiken.
quote:ik begrijp wat je bedoeld, wat ik probeerde te zeggen was dat php en javascript e.e.a. gemeen hebben, in ieder geval zijn er een aantal functies gelijk aan elkaar (of bijna dan.. ) Maar met Math.round ben ik er wel uit gekomen!Op maandag 31 januari 2005 10:14 schreef RM-rf het volgende:
[..]
ehm, php en javascript hebben niks met elkaar gemeen, vergeet dat alsjeblieft.
Ik ben pas net begonnen met javascript en het lukt me al aardig om er wat dingetjes mee te maken, ik kwam er achter dat een aantal functies van JS hetzelfde werken als de functies bij PHP, vandaar.
Maar in ieder geval bedankt voor je antwoord! Ik ga de andere optie ook proberen.. Maakt het nog veel uit voor de performance?
[ Bericht 0% gewijzigd door markiemark op 31-01-2005 11:11:35 ]
quote:In een textarea? Zie Firefox en getSelection() uit <textarea> ?!?Op zondag 30 januari 2005 20:39 schreef Chandler het volgende:
idd daar heb je gelijk... maar dan moet ik uitvinden waar selected text begint en eindigd
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 | <div><input checked="checked" type="checkbox" name="cookie" onclick="document.getElementById('autologout').style.display=this.checked?'visible':'blocked';"/> <span>Inloggen met een cookie</span> </div> <div id="autologout">Automatisch uitloggen na <select name="logintime"> <option value="10">10 minuten</option> <option value="30">30 minuten</option> <option value="60">een uur</option> <option value="360">een dag</option> <option value="10080">een week</option> <option value="0">nooit</option> </select> </div> |
ik krijg in IE de error "kan de eigenschap display niet opvragen. Ongeldig argument"
iemand enig idee? Ik weet vrij zeker dat het echt een hele stomme fout is...
quote:Op maandag 31 januari 2005 12:42 schreef daReaper het volgende:
Zo simpel, maar ik kijk er vast overheen:
[ code verwijderd ]
ik krijg in IE de error "kan de eigenschap display niet opvragen. Ongeldig argument"
iemand enig idee? Ik weet vrij zeker dat het echt een hele stomme fout is...
| 1 | 'visible':'blocked' |
hoe kom ik er op
| 1 | 'block':'none' |
* daReaper slaps self
Laat maar, niet goed gelezen.
ik heb de volgende code maar als er niets in ingevuld is in de pulldown krijg ik hierop een error
| 1 2 3 4 5 | if (document.getElementById('fontSize')) { document.getElementById('previewFont').style.fontSize = document.getElementById('fontSize').value + "pt"; } |
iemand een idee
Error alleen in IE, in FF geeft ie helemaal niets..
btw. waarom gebruik je niet gewoon document.forms.formname.fontSize.value?
-r-
quote:Daar heb ik een workaround voor gemaakt ooit. Een fetchElementById die in alle browsers werkt. Zou ik vanavond op kunnen zoeken...Op dinsdag 1 februari 2005 12:26 schreef Roönaän het volgende:
werkt ook in oudere browsers. getElementById is nog niet overal ondersteund.
quote:eenvoudigste is dit:Op dinsdag 1 februari 2005 12:30 schreef QuietGuy het volgende:
[..]
Daar heb ik een workaround voor gemaakt ooit. Een fetchElementById die in alle browsers werkt. Zou ik vanavond op kunnen zoeken...
| 1 2 3 4 | if(!document.getElementById) { if(document.all) document.getElementById = function(id) {return eval("document.all."+id);} } |
Mijn eerste beta editor te zien @ http://editor.bruggema.nl/editor.html
Gaarne bugs melden zodat ik ze kan oplossen, ennuh misschien nog tips? ik wil eingelijk alle onderliggende code converteren naar 'javascript' zodat ik eingelijk alleen maar een textarea hoef neer te zetten en klaar is keez.
)IE6
Algemeen:
Da wassut
quote:document.getElementById wordt ondersteund door IE5+, FF/Moz, NS6+, Opera6+ (?).Op dinsdag 1 februari 2005 12:26 schreef Roönaän het volgende:
werkt ook in oudere browsers. getElementById is nog niet overal ondersteund.
De enkeling die nu nog met NS4 browsed heeft pech. Er is toch echt een eind aan backward compatability.
Daar komt nog bij dat een browser die geen document.getElementById kent waarschijnlijk ook geen CSS ondersteunt. Daar ga je toch ook geen <font>-tags en andere ellende voor gebruiken?
quote:TnxOp woensdag 2 februari 2005 18:20 schreef SuperRembo het volgende:
Firefox 1.0Bij een selectie die begint bij de eerste letter gebeurt er niets
** 1e Letter? don't know what you mean?Font werkt niet (wel mooie dropdown
** hehe je eigen gekkertLink/email/image werkt niet
** Errors gevonden?Charactermap werkt wel maar is veel te breed.
** Huh? vaag, en hoe zou je die liever zien?Charactermap insert alleen aan 't eind van de hele tekst
** Hmm, dus ook midden en vooraan? of hoe had je dat graag gezien?
IE6Bij een selectie buiten de textarea wordt ook gereplaced. Leuk als je een button selecteerd
**Bij eerste keer font-selectie een error op line 155
** Ja en waar die fout nou zit? unknown!Link/email/image werkt niet
** Hier wel?Charactermap insert alleen aan 't eind van de hele tekst
** Zelfde iets als FF.
Algemeen:Ik zou link/email scheiden
** Is een mogelijkheidDe selectie blijft niet behouden
** Hoe bedoel je? ik niet snap
Da wassut
quote:Gewoon, een selectie die begint bij 't begin.Op woensdag 2 februari 2005 18:39 schreef Chandler het volgende:
Firefox 1.0
# Bij een selectie die begint bij de eerste letter gebeurt er niets
** 1e Letter? don't know what you mean?
quote:Dropdown werkt wel, maar er wordt niets gewijzigd in de textarea.# Font werkt niet (wel mooie dropdown )
** hehe je eigen gekkert maaruh font werkt niet? hier anders wel? Mozilla FF 1.0!
quote:Niet gezocht# Link/email/image werkt niet
** Errors gevonden?
quote:Invoegen op de plaats van de cursor, of selectie overschijven.# Charactermap werkt wel maar is veel te breed.
** Huh? vaag, en hoe zou je die liever zien?
# Charactermap insert alleen aan 't eind van de hele tekst
** Hmm, dus ook midden en vooraan? of hoe had je dat graag gezien?
quote:O, in IE werkt 't wel. Maar in FF ben je je selectie kwijt. Die moet je zelf in JS terugzetten.IE6
# Bij een selectie buiten de textarea wordt ook gereplaced. Leuk als je een button selecteerd
** idd ik weet nog niet hoe ik dat moet voorkomen zei Sop ook al
# Bij eerste keer font-selectie een error op line 155
** Ja en waar die fout nou zit? unknown!
# Link/email/image werkt niet
** Hier wel? vaagjes
# Charactermap insert alleen aan 't eind van de hele tekst
** Zelfde iets als FF.
Algemeen:
# Ik zou link/email scheiden
** Is een mogelijkheid
# De selectie blijft niet behouden
** Hoe bedoel je? ik niet snap
quote:Da wassut
Tnx
ik gebruik zeg maar dit: onclick="document.form.tekstveld.value +='hoi';"
quote:Heb je al "view source" geprobeerd, of wacht je gewoon tot het antwoord aan komt waaien?Op woensdag 2 februari 2005 21:37 schreef Tomek het volgende:
Chandler kun je mij misschien vertellen hoe je zeg maar bijvoorbeeld invoegt in die textarea op de plaats waar de cursor staat. Ik krijg alleen voor elkaar dat hij aan het eind komt te staan, met een + zegmaar. Ik ben namelijk een ontiechelijke javascript noob
ik gebruik zeg maar dit: onclick="document.form.tekstveld.value +='hoi';"
quote:Ja eerlijk gezegd wel. Het heeft ook geen hele hoge prioriteit.Op woensdag 2 februari 2005 22:07 schreef Roönaän het volgende:
[..]
Heb je al "view source" geprobeerd, of wacht je gewoon tot het antwoord aan komt waaien?
Maar nu je het zegt, iets anders als een kopie uit de source zal ik wel niet als antwoord hoeven verwachten, dus laat ik die source maar eens gaan bekijken
Ik hoop dat ik er iets van snap
quote:Overigens vraag ik het die jongen vriendelijk alvorens rustig zijn code te jatten.Op woensdag 2 februari 2005 22:07 schreef Roönaän het volgende:
[..]
Heb je al "view source" geprobeerd, of wacht je gewoon tot het antwoord aan komt waaien?
Wat ik nu dus al gedaan heb
Chandler als ik je een keer kan helpen met javascript ofzo dan hoor ik het wel hè
quote:Nog meerOp woensdag 2 februari 2005 19:10 schreef SuperRembo het volgende:
Gewoon, een selectie die begint bij 't begin.
** Klopt en dat is ook alleen maar in FF? waarom?
Dropdown werkt wel, maar er wordt niets gewijzigd in de textarea.
** Inderdaad, dit is alleen het geval in FF en niet in IE
Niet gezocht
** Tnx
Invoegen op de plaats van de cursor, of selectie overschijven.
** Ja dat gebeurd alleen als je de cursor in FF aan't begin zet
dat selectie probleem kan ik oplossen door verder niet selecteerbaar te maken dan het input form... maar dat komt later quote:Het stukje dat je nodig bent vind je tussen de functie insert en natuurlijk het einde van de javascript source van editor en ja je mag het wil rippen want het meeste van die code is verkregen door anderen dus indien je een link maakt naar qg en mijn site hebben wij daar alvast geen problemen mee.Op woensdag 2 februari 2005 22:40 schreef Tomek het volgende:
Overigens vraag ik het die jongen vriendelijk alvorens rustig zijn code te jatten.
Wat ik nu dus al gedaan heb
Chandler als ik je een keer kan helpen met javascript ofzo dan hoor ik het wel hè
En echt als je de source bekijkt moet je het gewoon opvallen en is dat niet het geval dan raad ik je vrolijk aan om eerst eens een paar beginselen voor html en javascript te gaan leren ( tutorialen) want zelfs ik kan het
quote:Ik heb het al wel draaiende, en ben er ook prima uitgekomen. html / css is allemaal geen probleem (tenminste meestalOp donderdag 3 februari 2005 00:21 schreef Chandler het volgende:
En echt als je de source bekijkt moet je het gewoon opvallen en is dat niet het geval dan raad ik je vrolijk aan om eerst eens een paar beginselen voor html en javascript te gaan leren ( tutorialen) want zelfs ik kan het
), maar javascript heb ik me nog nooit zo in verdiept. Helemaal niet eigenlijk. Ben het wel degelijk van plan; heb de boeken al in huis Maar toch bedankt
| 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 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 | <html> <head> <style type="text/css"> <!-- #scroll { position: absolute; top: 50px; left: 2px; width: 167px; background: white; layer-background-color: white; padding: 2px; border: none; } --> </style> <script language="javascript" type="text/javascript"> var clipTop = 0; var clipWidth = 187; var clipBottom = 450; var topper = 50; var lyrheight = 0; var time,amount,theTime,theHeight,DHTML; function init() { DHTML = (document.getElementById || document.all || document.layers) if (!DHTML) return; var x = new getObj('scroll'); if (document.layers) { lyrheight = x.style.clip.bottom; lyrheight += 20; x.style.clip.top = clipTop; x.style.clip.left = 0; x.style.clip.right = clipWidth; x.style.clip.bottom = clipBottom; } else if (document.getElementById || document.all) { lyrheight = x.obj.offsetHeight; x.style.clip = 'rect('+clipTop+' '+clipWidth+' '+clipBottom+' 0)' } } function scrollayer(layername,amt,tim) { if (!DHTML) return; thelayer = new getObj(layername); if (!thelayer) return; amount = amt; theTime = tim; realscroll(); } function stopScroll() { if (time) clearTimeout(time); } function realscroll() { if (!DHTML) return; clipTop += amount; clipBottom += amount; topper -= amount; if (clipTop < 0 || clipBottom > lyrheight) { clipTop -= amount; clipBottom -= amount; topper += amount; return; } if (document.getElementById || document.all) { clipstring = 'rect('+clipTop+' '+clipWidth+' '+clipBottom+' 0)' thelayer.style.clip = clipstring; thelayer.style.top = topper; } else if (document.layers) { thelayer.style.clip.top = clipTop; thelayer.style.clip.bottom = clipBottom; thelayer.style.top = topper; } time = setTimeout('realscroll()',theTime); } function vis(val) function getObj(name) { if (document.getElementById) { this.obj = document.getElementById(name); this.style = document.getElementById(name).style; } else if (document.all) { this.obj = document.all[name]; this.style = document.all[name].style; } else if (document.layers) { this.obj = document.layers[name]; this.style = document.layers[name]; } } </script> </head> <body onload="init()"> <div id="scroll">lorum ipsum, lange tekst ofzo </div> <a href="#" onmouseover="scrollayer('scroll',5,25)" onmouseout="stopScroll()">up</a> <a href="#" onmouseover="scrollayer('scroll',-5,25)" onmouseout="stopScroll()">down</a> </body> </html> |
Dit werkt fantastisch, zelfs netjes crossbrowser.
Totdat ik een doctype toevoeg. IE scrollt nog steeds keurig, FF niet.
Ik weet ook waarom dit is, Gecko based browsers accepteren geen values zonder eenheid. Dus moet ik op de juiste plekken px toevoegen.
Maar hoe en waar ik het ook probeer + "px" of gewoon px erachter) het verneukt alleen de werking.
Iemand welke een oplossing weet?
maar verder kan ik je hier niet mee helpen Inderdaad of {} er bij of weghalen die hap ? in realscroll():
| 1 2 3 4 5 6 | if (document.getElementById || document.all) { clipstring = 'rect('+clipTop+'px '+clipWidth+'px '+clipBottom+'px 0px)'; thelayer.style.clip = clipstring; thelayer.style.top = topper+'px'; } |
Vrij recht toe recht aan eigenlijk.
Chandler, uiteraard, zelfde gekut met het copy/paste verhaal.
SuperRembo, thanks. Ik zat vlak voor die return te kutten en bij de variabelen
quote:Dat klopt, want dan voldoet hij namelijk aan de W3C standaardenOp zondag 6 februari 2005 20:53 schreef Chandler het volgende:
Ik weet dat <script language="javascript" type="text/javascript"> gewoon <script type="text/javascript"> moet zijn
(en alle browsers snappen het wel) Jongens ik ga deze shit begrijpen @ http://editor.bruggema.nl/editor.html
2 bugs
- wanneer je iets invoegt is op eens de cursor verdwenen
kan die als het ware gerestored worden.- wanneer je niets selecteerd en de pointer staat niet in het textveld wordt alles buiten het 'textveld' ingevuld met waarden?
Iemand suggesties? want ik heb aardig wat zitten klooien maar kom er niet uit.
quote:Netjes!Op dinsdag 8 februari 2005 12:19 schreef Chandler het volgende:
Mensen, me scriptje is bijna netjes af maar nu het volgende.
@ http://editor.bruggema.nl/editor.html
2 bugs
- wanneer je iets invoegt is op eens de cursor verdwenen
- wanneer je niets selecteerd en de pointer staat niet in het textveld wordt alles buiten het 'textveld' ingevuld met waarden?
Iemand suggesties? want ik heb aardig wat zitten klooien maar kom er niet uit.
Zoiets heb ik ook nog nodig.
Binnenkort eens aan beginen
quote:Wat ik tegenwoordig ook steeds vaker zie gebeuren en waar ik op zich wel gecharmeerd van ben is het volgende:Op dinsdag 8 februari 2005 12:48 schreef Swetsenegger het volgende:
[..]
Netjes!
Zoiets heb ik ook nog nodig.
Binnenkort eens aan beginen
1) Drop ubb.
2) Geef de textarea hetzelfde font + fontcolor als hoe dat de tekst er na formprocessing uit zou zien.
3) Zorg ervoor dat de plek waar de tekst komt dezelfde whitespacing heeft als de textarea.
4) Vervang alleen urls en html en laat voor de rest de tekst as is.
Scheelt ontzettend veel coding, en omdat de tekst in de textarea zo goed als 1 op 1 overkomt in de uiteindelijke weergaven heft dit redelijk de toegevoegde waarde van ubb op wmb.
En de "wil je een afbeelding laten zien? Zet maar een link neer" mentaliteit bevalt me daarin ook wel. Scheelt een boel laadtijd.
quote:Kan toch alsnog? met een kleine converter of PHP previewer?Op dinsdag 8 februari 2005 13:03 schreef Roönaän het volgende:
[..]
Wat ik tegenwoordig ook steeds vaker zie gebeuren en waar ik op zich wel gecharmeerd van ben is het volgende:
1) Drop ubb.
2) Geef de textarea hetzelfde font + fontcolor als hoe dat de tekst er na formprocessing uit zou zien.
3) Zorg ervoor dat de plek waar de tekst komt dezelfde whitespacing heeft als de textarea.
4) Vervang alleen urls en html en laat voor de rest de tekst as is.
Scheelt ontzettend veel coding, en omdat de tekst in de textarea zo goed als 1 op 1 overkomt in de uiteindelijke weergaven heft dit redelijk de toegevoegde waarde van ubb op wmb.
En de "wil je een afbeelding laten zien? Zet maar een link neer" mentaliteit bevalt me daarin ook wel. Scheelt een boel laadtijd.
quote:nog mooier:Op dinsdag 8 februari 2005 13:03 schreef Roönaän het volgende:
[..]
Wat ik tegenwoordig ook steeds vaker zie gebeuren en waar ik op zich wel gecharmeerd van ben is het volgende:
1) Drop ubb.
2) Geef de textarea hetzelfde font + fontcolor als hoe dat de tekst er na formprocessing uit zou zien.
3) Zorg ervoor dat de plek waar de tekst komt dezelfde whitespacing heeft als de textarea.
4) Vervang alleen urls en html en laat voor de rest de tekst as is.
Scheelt ontzettend veel coding, en omdat de tekst in de textarea zo goed als 1 op 1 overkomt in de uiteindelijke weergaven heft dit redelijk de toegevoegde waarde van ubb op wmb.
En de "wil je een afbeelding laten zien? Zet maar een link neer" mentaliteit bevalt me daarin ook wel. Scheelt een boel laadtijd.
[textarea]
---------------
[divje]
op de textarea een onkeyup doen die een functie uitvoert, welke realtime in het divje de uitkomst van je textarea zet
Magoe, niet echt veel nuttiger dan een "Preview" knop ofzo...
quote:Tot zover is mijn methode de enige die werkt op browsers zonder javascript of afwijkend DOM model.Op zaterdag 12 februari 2005 00:51 schreef daReaper het volgende:
[..]
nog mooier:
[textarea]
---------------
[divje]
op de textarea een onkeyup doen die een functie uitvoert, welke realtime in het divje de uitkomst van je textarea zet
Magoe, niet echt veel nuttiger dan een "Preview" knop ofzo...
-r-
if(element.value)
{
//het is sowieso een of ander form element
}
else
{
//geen form element.
}
<script>
function smiley() {
return;
}
function Invoegen(Smiley) {
var edit;
var HuidigeTekst = document.formulier.bericht.value;
edit = HuidigeTekst+Smiley+" ";
document.formulier.bericht.value=edit;
document.formulier.bericht.focus();
return;
}
</script>
Nou, dat werkt dus goed, maar nu verschijnen die smilies als je erop klikt alleen maar in het tekstveld met de naam 'bericht' en ik wil dat dat óók werkt bij het tekstveld 'naam', omdat het een soort gastenboekje is voor m'n vrienden en sommige van mijn vrienden hebben een smiley die op hun lijkt
.Nu heb ik al verschilllende dingen zitten proberen, maar ik krijg het niet voor elkaar, want óf de smilies kwamen alleen nog maar in het tekstveld 'naam' óf als je een smiley aanklikte kwam die smiley in beide tekstvelden (naam, bericht) tegelijk.
En dan had ik nog een vraag, namelijk, als je bijvoorbeeld een tekst typt in het tekstveld 'bericht' en je wilt achteraf nog een smiley toevoegen ergens middenin het bericht door middel van erop te klikken werkt dat niet, want dan komt hij aan het einde van het bericht te staan, ook al heb je je cursor middenin het bericht gezet. Grote kans dat de smiley middenin het bericht plaatsen niet mogelijk is, want ik zie dat dat hier op FOK ook niet kan als je op de smiley klikt.
Alvast bedankt voor de oplossingen
.[ Bericht 0% gewijzigd door Joipoidoipoipoi op 17-02-2005 20:34:01 ]
quote:O.k, dus je bedoelt dat dat een veel te lang script wordt en dat dat dus niet opweegt tegen het nut ervan?Op donderdag 17 februari 2005 21:30 schreef SuperRembo het volgende:
Dat zit behoorlijk tricky in elkaar. IE en FF werken wat dit betreft compleet anders. Bij IE moet je bijvoorbeeld de selectie bewaren, omdat je die kwijt raakt op het moment dat je op het knopje voor de smiley klikt. Bij FF moet je bijvoorbeeld de scroll positie onthouden en na de aanpassing terugzetten (iets wat in replique ook niet gebeurt).
Iemand nog een oplossing voor mijn andere vraag?
Alvast bedankt
.| 1 2 3 4 5 6 | function AppendText(targetId, text) { var el = document.getElementById(targetId); if (!el) return; el.value += text; el.focus(); } |
| 1 2 3 4 5 | <img src="smile.gif" alt="Smile" title=":)" onclick="AppendText('name', ' :)')"> <input id="name" type="text"> <img src="smile.gif" alt="Smile" title=":)" onclick="AppendText('message', ' :)')"> <textarea id="message" rows="10" cols="100"></textarea> |
| 1 2 3 4 5 6 | function showOpm(opm){ document.getElementById(opm).style.display = "block"; } function hideOpm(opm){ document.getElementById(opm).style.display = "none"; } |
Bovenstaande code gebruik ik om een row in een tabel zichtbaar te maken en weer te laten verdwijnen. In IE werkt dit perfect, maar in FireFox werkt de hide functie niet helemaal goed. Hij haalt de tekst die in de betreffende rij staat wel weg, maar hij laat een leeg gapend gat over, dus de rij blijft wel bestaan, of eigenlijk "sluit" de tabel niet meer.. Weet iemand hoe ik dit kan verhelpen?
Bedankt!
De standaard stijl voor een tr is in FF niet 'block', maar 'table-row'. Als je de stijl van een tr op 'block' zet gebeuren er rare dingen. De standaard stijl in IE is wel 'block'. Gelukkig kan je de waarde terugzetten naar de standaard waarde door er een lege string aan toe te kennen.
| 1 2 3 4 5 6 | function showOpm(opm){ document.getElementById(opm).style.display = ""; } function hideOpm(opm){ document.getElementById(opm).style.display = "none"; } |
Ik heb dit:
| 1 2 3 4 5 | <td class="trans"><input type="radio" name="radio" value="test1"></td> <td class="trans"><input name="veld1"></td> <td class="trans"><input type="radio" name="radio" value="test2"></td> <td class="trans"><input name="veld2"></td> |
Bedankt
quote:Ik kom er totaal niet uit eigenlijk......
Ik zie niet in hoe dat ooit moet gaan werken..... Kan iemand me verder helpen?
of .style.checked=true
maar iig iets in die richting zou wel moeten werken denk ik
het is dit geworden:
onFocus="document.<formname>.<radioid>.checked=true"
quote:Je geeft de attribuut for de id van het element waar de label bij hoort.Op woensdag 23 februari 2005 21:14 schreef ikke_ook het volgende:
[..]
Ik kom er totaal niet uit eigenlijk......
Ik zie niet in hoe dat ooit moet gaan werken..... Kan iemand me verder helpen?
| 1 2 3 4 5 6 7 8 | <input id="btnColorRed" name="color" type="radio" value="red"> <label for="btnColorRed">Red</label> <input id="btnColorGreen" name="color" type="radio" value="green"> <label for="btnColorGreen">Green</label> <input id="btnColorBlue" name="color" type="radio" value="blue"> <label for="btnColorBlue">Blue</label> |
En dat werkt ook met andere elementen. En ook als javascript uitgeschakeld staat
quote:Bedankt! Ik heb helaas nog geen tijd gehad om het uit te proberen, maar als het gelukt is, post ik het hier .Op maandag 21 februari 2005 18:35 schreef SuperRembo het volgende:
[ code verwijderd ]
[ code verwijderd ]
| 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 | <html><head><body> <script language="javascript"> function fadeIn(i,j,fadeObject){ document.getElementById(fadeObject).filters.alpha.opacity=i; i++; if (i<j) setTimeout("fadeIn("+i+","+j+",'"+fadeObject+"')",0); } function fadeOut(i,j,fadeObject){ document[fadeObject].filters.alpha.opacity=i; i--; if (i>j) setTimeout("fadeOut("+i+","+j+",'"+fadeObject+"')", 0); } </script> <style type="text/css"> .button { filter:alpha(opacity="30"); } </style> <img src="button.gif" class="button" name="jahoe" onMouseOver="fadeIn(30,100,'jahoe');" onMouseOut="fadeOut(100,30,'jahoe');" width="88" height="31" border="0"> </body> </html> |
-edit-
wat ik overigens al geprobeerd heb:
| 1 2 3 4 5 6 7 8 9 10 11 12 13 | function fadeIn(i,j,fadeObject){ if (navigator.appName == "Microsoft Internet Explorer") { document.getElementById(fadeObject).filters.alpha.opacity=i; i=i+1; if (i<=j) setTimeout("fadeIn("+i+","+j+",'"+fadeObject+"')",0); }else{ i=i/10; j=j/10; document.getElementById(fadeObject).filters.alpha.-moz-opacitity=i; i=i+0.1; if (i<=j) setTimeout("fadeIn("+i+","+j+",'"+fadeObject+"')",0); } } |
Maar dat gaat niet goed :
quote:het gaat dus mis bij -moz-opacity.Error: missing name after . operator
Source File: http://localhost/exclusief/index2.php
Line: 18, Column: 66
Source Code:
document.getElementById(fadeObject).filters.alpha.-moz-opacitity=i;
[ Bericht 15% gewijzigd door Swetsenegger op 02-03-2005 09:23:20 ]
| 1 2 3 4 5 | #trans { filter:alpha(opacity=50);/* IE */ -moz-opacity:0.5;/* Moz */ opacity: 0.5;/* CSS3 */ } |
En je moet 't goed spellen, dus niet opacitity
quote:Dank je. Ja stiekem wist ik dat. Maar... hoe verwerk ik dit in bovenstaand script?Op woensdag 2 maart 2005 13:04 schreef SuperRembo het volgende:
Alleen IE kent filters, in mozilla regel je dat met CSS
[ code verwijderd ]
En je moet 't goed spellen, dus niet opacitity
| 1 2 | var el = document.getElementById(id); el.style.MozOpacity = 0.5; |
quote:Zo even kijken!
Ander probleem:
| 1 2 3 4 5 6 7 8 | function slideDown(s){ if(document.getElementById){ if(parseInt(obj.style.top) < s){ obj.style.top = parseInt(obj.style.top) + 2 + "px"; setTimeout("slideDown(s)",15); } } } |
Error: s is not defined in setTimeout("slideDown(s)",15);
hoe geef ik die variable s weer mee aan de functie?
-edit-
setTimeout("slideDown("+s+")",15);
[ Bericht 6% gewijzigd door Swetsenegger op 02-03-2005 15:16:44 ]
quote:
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 | function fadeIn(i,j,fadeObject){ if (navigator.appName == "Microsoft Internet Explorer") { document.getElementById(fadeObject).filters.alpha.opacity=i; i=i+1; if (i<=j) setTimeout("fadeIn("+i+","+j+",'"+fadeObject+"')",0); }else{ i=i/10; j=j/10; var el = document.getElementById(fadeObject); el.style.MozOpacity = i; i=i+0.1; i=i*10; j=j*10; if (i<=j) setTimeout("fadeIn("+i+","+j+",'"+fadeObject+"')",0); } } |
error: el has no properties
quote:Mjah, dat is dus raar want die functie wordt gewoon met een onmouseover aangeroepen.Op woensdag 2 maart 2005 16:25 schreef SuperRembo het volgende:
Ja ehh, dan zal ie fadeObject wel niet gevonden hebben he.
In I.E. wordt fadeObject wel gevonden en in ff niet
quote:OpgelostOp woensdag 2 maart 2005 17:05 schreef Swetsenegger het volgende:
[..]
Mjah, dat is dus raar want die functie wordt gewoon met een onmouseover aangeroepen.
In I.E. wordt fadeObject wel gevonden en in ff niet
De onmouseover had nu name="fadeobject" waarbij fadeobject dus een naam is
en dat werkt niet. met id="fadeobject" doet ie het ook (min of meer) onder FF
quote:Not a function zegt de javascript console
opgelost
[ Bericht 25% gewijzigd door Swetsenegger op 03-03-2005 13:27:34 ]
bij een onmouse out spring ik eerst naar een timer van 500ms. Na die 500ms schuif ik de div weer terug.
krijg ik binnen het verloop van de timer weer een onmouse over reset ik de timer:
| 1 2 3 4 5 6 7 | <script> function timer(t,laag) { var idle=setTimeout("slideUp("+t+",'"+laag+"')", 500); } </script> <div style="position:absolute; width:100px; height:100px; background-color:black; cursor:pointer; cursor:hand;" onmouseover="slideDown(170,203,'contactmenu');clearTimeout('idle');" onmouseout="timer(170,'contactmenu');"><img src="image/contact.jpg" class="menu" id="contact" /></div> |
Dit werkt prima.
Maar wanneer ik nu TWEE verschillende div's uitschuif, dan reset ik bij de onmouse over de timer van de laatste onmouse out en NIET de timer van de div welke ik bedoel.
hoe kan ik de timer functie zo maken dat ik met clearTimeout('div-naam); de timer reset?
quote:Dat is een goede. Nu ff zoeken hoe ik items aan een array toevoeg in javascriptOp donderdag 3 maart 2005 18:17 schreef SuperRembo het volgende:
Je kan de timers in een globale array zetten met als key de id van de div.
| 1 2 3 4 5 6 7 8 9 | <script> var idle=new Array(); function timer(t,laag) { idle[laag]=setTimeout("slideUp("+t+",'"+laag+"')",500); } </script> <div style="position:absolute; width:100px; height:100px; background-color:black; cursor:pointer; cursor:hand;" onmouseover="slideDown(170,203,'contactmenu');clearTimeout(idle['contactmenu']);" onmouseout="fadeOut(99,85,'contact');timer(170,'contactmenu');"><img src="image/contact.jpg" class="menu" id="contact" /></div> |
Dat ik verdorie niet eerder aan een array heb gedacht
quote:denk wel dat het mogelijk is via getElementById('divid')... en dan iets met Height ofzo. Ben het niet zeker, want heb het nog nooit nodig hadOp zaterdag 5 maart 2005 13:46 schreef Swetsenegger het volgende:
Kan ik met javascript de hoogte vinden van een div welke geen fixed height heeft?
quote:
document.getElementById(div).style.height ?
| 1 2 3 4 5 6 7 | function getWidth(el) { return el.clientWidth || el.offsetWidth; } function getHeight(el) { return el.clientHeight || el.offsetHeight; } |
Of als je 't wat netter wil doen:
| 1 2 3 4 5 6 7 8 9 | function getWidth(el) { if (typeof el.offsetWidth != 'undefined') { return el.offsetWidth; } else if (typeof el.clientWidth != 'undefined') { return el.clientWidth; } else { return null; } } |
Een voorbeeld.
Ik heb een tabel die bestaat uit 2 rijen.
| 1 2 3 4 5 | --------- | | | |1| 2 | | | | --------- |
en de breedte van 1 is 100px en van 2 is die 600px.
Nu wil ik dat wanneer er een text in 2 staat die langer is dan 600px er automatisch een balkje komt om de text te scrollen en wanneer deze er niet is dat scroll balkje niet zichtbaar is.
Is dit mogelijk met JS? want volgens mij is dit in HTML niet echt te verwezelijken.
Tnx ppl!
| 1 2 3 4 5 6 7 8 9 | .outer { width: 600px; } .inner { width: 100%; overflow: auto; overflow-y: hidden;/* IE only */ } |
Moet mss nog een beetje getweakt worden.
| 1 2 3 4 5 6 7 8 9 | <div style="width: 200px; height: 200px; overflow: auto;"> Na php voor dummies wordt het nu tijd voor javascript voor dummies. Ik ben een absolute leek met javascript, ik jat af en toe wat scripts en snap dan net genoeg om het met wat aanpassingen te kunnen gebruiken, maar wat meer kennis zou makkelijk zijn. Wat ik wil. Ik wil tijdens het laden van een pagina, sommige elementen (div's) iets later dan de container background div het scherm in schuiven. Dus het menu (bv) zie je de pagina inscrollen) Iemand hints en tips om dit te realiseren? Met welke eventhandler pak ik dit aan en is het uberhaupt mogelijk? </div> |
dat moet werken hoor!! het moet dus met css en niet met javascript..
Ik vind wel diverse van die scripts, maar die tellen bij de opgegeven datum vanaf 0.00
Zelf dacht ik heel simpel met de epoch te kunnen rekenen, maar daar kom ik niet uit.
Iemand een mooie link naar zo'n scriptje?
quote:Je krijgt het wel voor elkaar om 2 date()-objecten aan te maken, welke je wilt vergelijken?Op vrijdag 18 maart 2005 16:46 schreef Swetsenegger het volgende:
Ik zoek een javascript welke uiteraard realtime de verlopen tijd tussen een opgegeven datum en tijd tot *nu* toont.
Ik vind wel diverse van die scripts, maar die tellen bij de opgegeven datum vanaf 0.00
Zelf dacht ik heel simpel met de epoch te kunnen rekenen, maar daar kom ik niet uit.
Iemand een mooie link naar zo'n scriptje?
quote:ehmz.Op vrijdag 18 maart 2005 17:00 schreef QuietGuy het volgende:
[..]
Je krijgt het wel voor elkaar om 2 date()-objecten aan te maken, welke je wilt vergelijken?
help me ff op weg getTime()?
quote:Heb je al een stukje html? Scheelt me een hoop tijdOp vrijdag 18 maart 2005 17:20 schreef Swetsenegger het volgende:
[..]
ehmz.
help me ff op weg getTime()?
quote:Ik heb 'm al.Op vrijdag 18 maart 2005 17:25 schreef QuietGuy het volgende:
[..]
Heb je al een stukje html? Scheelt me een hoop tijd
Heb die functie verbouwd welke vanaf een datum 0.00 tot nu telt (gewoon het aantal uren en minuten waar vanaf IK wil tellen eraf getrokken
)quote:Heb je een linkje?Op vrijdag 18 maart 2005 17:28 schreef Swetsenegger het volgende:
[..]
Ik heb 'm al.
Heb die functie verbouwd welke vanaf een datum 0.00 tot nu telt (gewoon het aantal uren en minuten waar vanaf IK wil tellen eraf getrokken
quote:www.rickpeinemann.nl
Het is wel een smerig script trouwens
Vanavond wel ff goed in zoeken, maar dit moest ff
Het spreek voor zich denk ik:
| 1 2 3 4 5 6 7 8 9 10 11 | <html> <head> <style type="text/css"> body.noload div#loading {background:red;} body.load div#loading {background:green;} </style> </head> <body class="load" onload="this.className='noload';"> <div id="loading">Loading</div> </body> </html> |
Het probleem is dus, waarom die div#loading groen blijft en niet rood wordt.
-r-
Als ik het email veld invul en ik klik op enter dan submit hij niet.. althans, niet in IE, wel in firefox.
De focus wordt wel automatisch goed gezet, althans daar lijkt wel op..
Hoe krijg ik t voor elkaar dat t wel goed werkt?
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 | <form method="post" action="./passmailer.php"> <table> <tr> <td>Voer hieronder het emailadres in waarmee u hier geregistreerd bent dan krijgt u een nieuw wachtwoord toe gemaild.</td> </tr> <tr> <td>Emailadres</td> <td><input type="text" name="email" size="30"></td> </tr> <tr> <td></td> <td><input type="submit" name="verstuur" value="Verstuur"></td> </tr> </table> </form> |
Bedankt!
[ Bericht 0% gewijzigd door ikke_ook op 21-03-2005 18:37:50 ]
quote:this verwijst blijkbaar niet naar de body node zoals je zou verwachten. document.body.className = 'noload' werkt bijvoorbeeld wel (getest in FF en IE6).Op maandag 21 maart 2005 16:32 schreef Roönaän het volgende:
What am I missing here? (Ik zoek niet zozeer naar varianten op dit thema, maar meer naar wat ik gewoon over het hoofd zie in dit script.)
Het spreek voor zich denk ik:
[ code verwijderd ]
Het probleem is dus, waarom die div#loading groen blijft en niet rood wordt.
-r-
quote:Welk script? Ik zie alleen html.Op maandag 21 maart 2005 18:22 schreef ikke_ook het volgende:
Ik heb een probleempje met onderstaand script als het in een website zit verwerkt,los werkt t wel goed.
Als ik het email veld invul en ik klik op enter dan submit hij niet.. althans, niet in IE, wel in firefox.
De focus wordt wel automatisch goed gezet, althans daar lijkt wel op..
Hoe krijg ik t voor elkaar dat t wel goed werkt?
[ code verwijderd ]
Bedankt!
quote:I noticed. Maar naar jouw weten; is dit een standaard browser design iets zeg maar waar ik als developer iets van zou moeten weten? Vind het namelijk redelijk strange.Op maandag 21 maart 2005 18:28 schreef SuperRembo het volgende:
[..]
this verwijst blijkbaar niet naar de body node zoals je zou verwachten. document.body.className = 'noload' werkt bijvoorbeeld wel (getest in FF en IE6).
Zag net ook dat als je this.body.className doet, dat het dan wel werkt. Apparently krijg je dus in de onload altijd de document node terug als je this gebruikt.
quote:Pfff
Ik ben gewend om in PHP voor dummies te posten en daar gaat t wel altijd over een script.
Betreffende code dan...
quote:Als ik http://www.quirksmode.org/viewport/experiments.html er even snel op na sla dan lijkt dat idd standaard gedrag.Op maandag 21 maart 2005 18:33 schreef Roönaän het volgende:
[..]
I noticed. Maar naar jouw weten; is dit een standaard browser design iets zeg maar waar ik als developer iets van zou moeten weten? Vind het namelijk redelijk strange.
Zag net ook dat als je this.body.className doet, dat het dan wel werkt. Apparently krijg je dus in de onload altijd de document node terug als je this gebruikt.
| 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 99 100 101 102 103 104 | <script language= "JavaScript" type="text/javascript"> function Browser() {var ua,s,i;this.isIE=false;this.isNS=false;this.version=null; ua = navigator.userAgent;s="MSIE";if((i=ua.indexOf(s))>=0){this.isIE=true; this.version=parseFloat(ua.substr(i + s.length));return;}s="Netscape6/"; if((i=ua.indexOf(s))>=0){this.isNS=true;this.version=parseFloat(ua.substr(i+s.length)); return;}s="Gecko";if((i=ua.indexOf(s))>=0){this.isNS=true;this.version=6.1; return;}}var browser=new Browser();var activeButton=null; if(browser.isIE)document.onmousedown=pageMousedown; else document.addEventListener("mousedown",pageMousedown,true); function pageMousedown(event){var el;if(activeButton==null)return; if(browser.isIE)el=window.event.srcElement; else el=(event.target.tagName?event.target:event.target.parentNode); if(el== activeButton)return; if(getContainerWith(el,"DIV","menu")==null){resetButton(activeButton);activeButton = null; }} function buttonClick(event,menuId){var button; if(browser.isIE)button=window.event.srcElement; else button=event.currentTarget;button.blur(); if(button.menu==null){button.menu = document.getElementById(menuId); if(button.menu.isInitialized==null)menuInit(button.menu);} if(activeButton!=null)resetButton(activeButton); if(button!=activeButton){depressButton(button);activeButton = button;} elseactiveButton=null;return false;} function buttonMouseover(event, menuId){var button; if(browser.isIE)button=window.event.srcElement;else button=event.currentTarget; if(activeButton!=null&&activeButton!=button)buttonClick(event, menuId);} function depressButton(button){var x,y;button.className+=" WinKnopActive"; x=getPageOffsetLeft(button);y=getPageOffsetTop(button)+ button.offsetHeight; if (browser.isIE){x+=button.offsetParent.clientLeft; y+=button.offsetParent.clientTop;} button.menu.style.left=x+"px";button.menu.style.top=y+"px"; button.menu.style.visibility="visible";} function resetButton(button){removeClassName(button,"WinKnopActive"); if(button.menu!=null){closeSubMenu(button.menu);button.menu.style.visibility="hidden";}} function menuMouseover(event){var menu; if(browser.isIE)menu=getContainerWith(window.event.srcElement,"DIV","menu"); else menu=event.currentTarget;if(menu.activeItem!=null)closeSubMenu(menu);} function WinItemMouseover(event,menuId){var item,menu,x,y; if(browser.isIE)item=getContainerWith(window.event.srcElement,"A","WinItem"); else item=event.currentTarget;menu=getContainerWith(item,"DIV","menu"); if(menu.activeItem!=null)closeSubMenu(menu);menu.activeItem=item; item.className+=" WinItemOplichten"; if(item.subMenu==null){item.subMenu=document.getElementById(menuId); if(item.subMenu.initialized==null)menuInit(item.subMenu);} x=getPageOffsetLeft(item)+item.offsetWidth;y=getPageOffsetTop(item);var maxX,maxY; if(browser.isNS){maxX=window.scrollX+window.innerWidth; maxY=window.scrollY+window.innerHeight;} if(browser.isIE){maxX=(document.documentElement.scrollLeft!=0? document.documentElement.scrollLeft:document.body.scrollLeft) +(document.documentElement.clientWidth!=0? document.documentElement.clientWidth:document.body.clientWidth); maxY=(document.documentElement.scrollTop!=0? document.documentElement.scrollTop:document.body.scrollTop) +(document.documentElement.clientHeight!=0? document.documentElement.clientHeight:document.body.clientHeight);} maxX-=item.subMenu.offsetWidth;maxY-=item.subMenu.offsetHeight; if(x>maxX)x=Math.max(0,x-item.offsetWidth-item.subMenu.offsetWidth +(menu.offsetWidth-item.offsetWidth));y=Math.max(0,Math.min(y, maxY)); item.subMenu.style.left=x+"px";item.subMenu.style.top=y+"px"; item.subMenu.style.visibility="visible"; if(browser.isIE)window.event.cancelBubble=true;else event.stopPropagation();} function closeSubMenu(menu){if(menu==null||menu.activeItem==null)return; if(menu.activeItem.subMenu!=null){closeSubMenu(menu.activeItem.subMenu); menu.activeItem.subMenu.style.visibility="hidden";menu.activeItem.subMenu=null;} removeClassName(menu.activeItem,"WinItemOplichten");menu.activeItem=null;} function menuInit(menu){ var itemList,spanList;var textEl,pijltjeEl;var itemWidth;var w,dw;var i,j; if(browser.isIE){menu.style.lineHeight="2.5ex"; spanList=menu.getElementsByTagName("SPAN"); for(i=0;i< spanList.length; i++) if(hasClassName(spanList[i],"WinItempijltje")){ spanList[i].style.fontFamily="Webdings";spanList[i].firstChild.nodeValue="4";}} itemList=menu.getElementsByTagName("A"); if(itemList.length>0)itemWidth=itemList[0].offsetWidth;else return; for(i=0; i < itemList.length; i++) { spanList=itemList[i].getElementsByTagName("SPAN") textEl=null pijltjeEl = null; for(j=0; j < spanList.length; j++) { if(hasClassName(spanList[j],"WinItemText"))textEl=spanList[j]; if(hasClassName(spanList[j],"WinItempijltje"))pijltjeEl=spanList[j];} if(textEl!=null&&pijltjeEl!=null) textEl.style.paddingRight=(itemWidth-(textEl.offsetWidth+pijltjeEl.offsetWidth))+"px";} if (browser.isIE){w=itemList[0].offsetWidth; itemList[0].style.width=w+"px";dw=itemList[0].offsetWidth-w;w-=dw; itemList[0].style.width=w+"px";} menu.initialized=true;} function getContainerWith(node,tagName,className){ while(node!=null){ if(node.tagName!=null&&node.tagName==tagName&&hasClassName(node,className)) return node;node=node.parentNode;}return node;} function hasClassName(el,name){ var i,list;list=el.className.split(" "); for(i=0;i<list.length;i++)if(list[i]==name)return true;return false;} function removeClassName(el,name){ var i,curList,newList;if(el.className==null)return; newList=new Array();curList=el.className.split(" "); for(i=0;i<curList.length;i++) if(curList[i]!=name)newList.push(curList[i]);el.className=newList.join(" ");} function getPageOffsetLeft(el){var x;x=el.offsetLeft; if(el.offsetParent!=null)x+=getPageOffsetLeft(el.offsetParent);return x;} function getPageOffsetTop(el){var y;y=el.offsetTop; if(el.offsetParent!=null)y+=getPageOffsetTop(el.offsetParent);return y;} </script> |
Dit is een submenu wat naar beneden openklapt. Ik wil nu dat het menu naar rechts openschuift, en dus dat de hoofdmenu's bovenelkaar staan.... weet iemand hier raad mee?
quote:Haha, jij denkt serieus dat iemand hiernaar gaat kijken?Op donderdag 24 maart 2005 11:34 schreef jeroen-heeft-koffie-nodig het volgende:
ok heb de volgende code:
[ code verwijderd ]
Dit is een submenu wat naar beneden openklapt. Ik wil nu dat het menu naar rechts openschuift, en dus dat de hoofdmenu's bovenelkaar staan.... weet iemand hier raad mee?
Die code is totaal onleesbaar man!
Ik denk dat de tip van Superrembo een goede is
quote:hmm ja nou ik kan de maker ervan niet vindenOp donderdag 24 maart 2005 23:54 schreef ikke_ook het volgende:
[..]
Haha, jij denkt serieus dat iemand hiernaar gaat kijken?
Die code is totaal onleesbaar man!
Ik denk dat de tip van Superrembo een goede is
dus ja, je weet maar nooit ik wil bijvoorbeeld als in dit dropdown menu 'link' wordt gekozen dat er een tekst veld bij komt.| 1 2 3 4 | <select name="type"> <option>Geen link</option> <option>Link</option> </select> |
En dus als link wordt gekozen, moet deze eronder komen:
| 1 | <input name="link" type="text"> |
nevermind
quote:Met het onclick event van de checkboxen kun je de wijzigingen bijhouden.Op vrijdag 25 maart 2005 22:55 schreef ikke_ook het volgende:
Ik wil graag in een tekstveldje realtime bijhouden hoeveel checkboxen er zijn aangevinkt in een form, dus zonder dat hij de pagina ververst ofzo. Hoe kan ik zoiets handig maken?
quote:Iedere keer dat je op een checkbox klikt checken hoeveel checkboxen on zijn?Of is er iets handigers voor?Op zaterdag 26 maart 2005 09:49 schreef SuperRembo het volgende:
[..]
Met het onclick event van de checkboxen kun je de wijzigingen bijhouden.
quote:Dat zou kunnen, of je houd alleen de wijzigingen bij.Op zaterdag 26 maart 2005 17:53 schreef ikke_ook het volgende:
[..]
Iedere keer dat je op een checkbox klikt checken hoeveel checkboxen on zijn?Of is er iets handigers voor?
| 1 2 3 4 5 6 7 8 9 10 11 | function CountCheckboxes() { var count, length; checks = 0; length = document.form.elements.length; for (i=0; i < count; i++) { if(document.form.elements[i].checked){ count++; } } document.form.count.value = count; } |
Het werkt goed maar ik denk dat t nog wel efficienter kan. Heeft er nog iemand zin om dit te optimaliseren?
| 1 2 3 4 5 6 7 8 9 10 11 | function CountCheckboxes() { var count, length; count = 0; length = document.form.elements.length; for (i=0; i < length; i++) { if(document.form.elements[i].checked){ count++; } } document.form.count.value = count; } |
| 1 2 3 4 5 6 7 | function Count(checkboxid) { if( document.getElementById(checkboxid).checked){ document.form.count.value++; }else{ document.form.count.value--; } } |
Het gaat namelijk om een form met 850 checkboxes en 850 text invoer vakjes
| 1 2 3 4 5 6 7 | function CheckClicked(chk) { if (chk.checked) { document.form.elements.count.value++; } else { document.form.elements.count.value--; } } |
| 1 | <input type="checkbox" onclick="CheckClicked(this)"> |
Ik heb een tabel(form) gemaakt met 10 invoervakjes. Achter ieder invoervakje staat een pijltje waarmee je een nieuw invoervakje onder het huidige invoervakje kan laten verschijnen.
Dit doe ik door een <tr> zichtbaar te maken (default is niet zichtbaar).
Ik wil dat als ik op het pijltje klik dat de focus naar het nieuwe invoer vakje gaat.
Hiervoor had ik het volgende bedacht :
| 1 2 3 4 | function NewInput(opm,focusfield){ document.getElementById(opm).style.display = ""; document.getElementById(focusfield).focus(); } |
Dit werkt prima in IE, in Firefox werkt t ook wel, de focus wordt ook wel goed gezet, alleen verspringt je beeld naar helemaal bovenaan de tabel in plaats van gewoon te blijven staan waar t stond......
Snap je
Ik hoop dat t duidelijk is wat ik bedoel....
quote:Nee, alleen achter een inloggedeelte met een database eraan..... Tis namelijk een form waarmee je dingen toe kunt voegen in een database en tis niet de bedoeling dat de hele wereld daar bij kan...Op zaterdag 26 maart 2005 22:52 schreef SuperRembo het volgende:
Heb je een voorbeeldpagina online staan?
Ik maak morgen of overmorgen wel even iets wat los is van die database is en hetzelfde doet.
Ik moet nu weg namelijk, maar alvast bedankt voor t kijken dan
http://www.vogelaars.nl/jstest.htm
Klik maar eens op meerdere pijltjes achter verschillende vakjes op verschillende hoogtes op de pagina.
Dan zie je dat hij soms helemaal naar boven springt.
Geen commentaar op de pijltjes, want ik weet, die zien er niet uit
En de site laadt zo traag omdat het zo'n grote tabel is waar alle cellen geen aangegeven grootte hebben.| 1 2 3 4 5 6 7 | function showOpm(opm,focusfield){ var a; a = document.scrollTop; document.getElementById(opm).style.display = ""; document.getElementById(focusfield).focus(); document.scrollTop = a; } |
Maar dat werkt niet, of is t iets minder simpel?
quote:[b]Op vrijdag 25 maart 2005 17:30 even een ander vraagje
1
2
3
4<select name="type">
<option>Geen link</option>
<option>Link</option>
</select>
En dus als link wordt gekozen, moet deze eronder komen:
1 <input name="link" type="text">
| 1 | <select onchange="foo()" > |
enzo
Waarom gebruik je een dropdown als het een aan/uit optie is. Dan lijkt me een checkbox beter geschikt.
quote:Bedankt, t werkt, alleen wel jammer dat t beeld ff naar boven schiet en dan weer naar beneden...Op zondag 27 maart 2005 13:52 schreef SuperRembo het volgende:
In FF is het document.body.scrollTop. In IE is het window.pageYOffset, maar die heb je niet nodig.
Maar dan moet je maar geen FF gebruiken
quote:Welke idioot maakt er dan ook een tabel met 1000 regelsOp zondag 27 maart 2005 19:58 schreef ikke_ook het volgende:
[..]
Bedankt, t werkt, alleen wel jammer dat t beeld ff naar boven schiet en dan weer naar beneden...
Maar dan moet je maar geen FF gebruiken
Ik denk dat wel eens beter zou kunnen werken als je per vogel een tabel cel maakt. In die cell zet je dan een kleinere tabel met de optionele invoervelden.
Nog mooier is het als je via het DOM de optionele velden toevoegt. Dan zit je niet met al die invoervelden die je wel maakt maar niet gebruikt.
quote:Kun je beide dingen een beetje uitleggen?Ik snap ze beide niet namelijkOp zondag 27 maart 2005 21:34 schreef SuperRembo het volgende:
[..]
Welke idioot maakt er dan ook een tabel met 1000 regels
Ik denk dat wel eens beter zou kunnen werken als je per vogel een tabel cel maakt. In die cell zet je dan een kleinere tabel met de optionele invoervelden.
Nog mooier is het als je via het DOM de optionele velden toevoegt. Dan zit je niet met al die invoervelden die je wel maakt maar niet gebruikt.
[ Bericht 71% gewijzigd door ikke_ook op 27-03-2005 23:25:59 ]
Van scrips enzo heb ik weinig kaas gegeten, ik heb alleen m'n uiterst simpele homepage in html gedaan. Maar gewone applicaties schrijven lijkt me leuker.
| 1 | var count, length; |
Moet je in javascript geen type aangeven?
quote:Ik ging er van uit dat die invoervakjes bij de vogel hoort die er boven staat, maar dat is niet zo.Op zondag 27 maart 2005 22:59 schreef ikke_ook het volgende:
[..]
Kun je beide dingen een beetje uitleggen?Ik snap ze beide niet namelijk
| 1 2 3 | var text = "The quick fox jumps over a lazy dog."; var matches = text.match(/a/ig); var count = matches==null ? 0 : matches.length; |
Niet getest. Sommige tekens zal je moeten escapen in de regexp.
quote:Java en javascript moet je niet willen vergelijken.Op zondag 27 maart 2005 23:22 schreef whosvegas het volgende:
[ code verwijderd ]
Moet je in javascript geen type aangeven?
) een foto komt te staan, die uit een map word gehaald.. Dus een random plaatje.. Heef tiemand enig idee hoe ik dat moet doen? De (HTML)code die ik nu heb is deze:| 1 | <a href="fotos.html"><img src="http://www.solcon.nl/luinstra/ONRA1/actief_thuis/images/IMG_0169.jpg" width="300" height="200" border="0"></a> |
De grote moet wél zo groot blijven!
Bvd
De code is simpel alleen vond ik dit wel intressant om te maken aangezien ik dit nog niet eerder heb gezien.
Alleen loop ik nu vast
| 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 | <script language="javascript" type="text/javascript"> <!-- var domain, subdomain, location; domain = document.domain; subdomain = new Array(); flocation = new Array(); subdomain[0] = "test"; flocation[0] = "/test/index.html"; subdomain[1] = "private"; flocation[1] = "/private/index.html"; subdomain[2] = "test"; flocation[2] = "/test/index.html"; function SubDomain() { for(i=0; // <------ en nu??? if(domain = subdomain[i]) { document.location.href=flocation[i]; } } Subdomain(); --> </script> |
Natuurlijk kan dit ook met PHP/ASP of een andere serverside techniek, maar wil dit graag met javascript maken.
Waar ik op vast loop is het volgende.. ik wil met een loopje mn subdomeinen array doorlopen, alleen hoe pak ik dat nou het beste aan??
edit: document.domain; laat forum.fok.nl ik moet eerst nog het domein exploden met split(); maar dat komt wel goed
Ik wil dus graag dat er een waarschuwing komt als iemand op back klikt. Ik heb namelijk een invoer gedeelte wat uit 3 stappen bestaat, en na stap 1 wordt er iets in een tabel geschreven waarna je naar stap 2 gaat. Maar als je dan op back klikt en daarna weer op verder, staat de informatie 2x in de tabel.. en dat wil ik dus afvangen door een confirm te doen als iemand op back klikt
[ Bericht 2% gewijzigd door ikke_ook op 01-04-2005 21:19:42 ]
Of zullen we ff verhuizen naar t php topic dan
quote:Dat kan via een hidden input tag.Op vrijdag 1 april 2005 21:29 schreef ikke_ook het volgende:
maar hoe moet ik dat doen via 1 script dan?want ik heb nu wel steeds dezelfde pagina, alleen dan de ene keer met ?action=stap1, en dan met ?action=stap2...
Of zullen we ff verhuizen naar t php topic dan
Alleen werkt het niet zoals ik dacht
. No-cache headers werken ook niet goed
Het moet ook in verschillende stappen blijven, want form2 hangt af van de input van form1...
-edit-
En ik heb al zitten denken aan een tussen pagina, waar alleen een header wordt verstuurd met de nieuwe url, waardoor je backknop niet meer werkt, alleen vind ik dat niet zo netjes..
quote:Waarom niet? Dat werkt primaOp vrijdag 1 april 2005 21:32 schreef SuperRembo het volgende:
[..]
Dat kan via een hidden input tag.
Alleen werkt het niet zoals ik dacht
quote:Leg uit leg uit!
-edit-
Oh gewoon dat je geen $_GET uitleest, maar een $_POST, en daarop baseert welke functie in je phpfile moet worden uitgevoerd?
En dan werkt de backknop niet meer?
quote:Leg in het php topic precies uit wat je wil (server side he) want ik begrijp niet goed waarom je tussendoor al naar db gaat schrijven. Doe dat pas als alles afgehandeld is, voorkom je ook problemen met backbuttons.
Wat ik bedoelde is dat je met hidden input perfect extra waarden aan je submit kan meegeven.
Dus bij stap 1 schrijf je niets naar db, maar je geeft die info met een get mee aan stap 2. In stap 2 krijg je een nieuwe waarde PLUS je oude waarde welke je uit je get als hidden input aan je submit meegeeft. Dat geef je weer met een get mee aan stap 3 (via headers dus) leest in stap 3 de info van stap 1 en 2 uit en die stop je in een hidden input. INfo van stap 3 erbij, submitten antwoord tonen en naar db schrijven....
is die & tag nu gefixt?
quote:Web-irritatie nummer 1: popupsOp zondag 3 april 2005 23:13 schreef Chandler het volgende:
Heeft iemand een idee hoe ik een scrollbar als in volgende preview shotje kan realiseren met divs en javascript?
[afbeelding]
is die & tag nu gefixt?
Web-irritatie nummer 2: zelf-bouw-scrolbars-die-noot-werken-zoals-je-verwacht
Daar werk ik niet aan mee
Of heb je gewoon geen flauw idee of het mogelijk is