DIG Digital Corner
Alles wat je altijd al over computers, hardware, software, internet en elektronische gadgets had willen weten, maar niet op Tweakers.net durft te vragen.
Opmaak kun je gewoon zoals altijd met CSS doen. Maakt niet uit of je elementen dynamisch zijn of niet.quote:Op dinsdag 31 mei 2011 21:13 schreef Chandler het volgende:
[..]
Laat me mijn vorige vraag anders stellen
Stel ik wil mijn HTML automatiseren middels javascript/jQuery door bepaalde elementen te voorzien van functies oa; auto suggest op velden, verwijzingen middels ajax van tabs naar divs of extern te laden pagina's...
Hoe zou ik dan de opmaak van elementen moeten maken? Een groot ontwerp moet namelijk omgezet worden naar html en wil dit nu op een tijdige manier aanpakken...
Ik denk dan aan het toevoegen van bepaalde noemers aan classes (class="class1 class2 class3") zodat ik deze simpel kan filteren middels jQuery. Op het web kon ik hier niets zinnigs over vinden.
En classnames als "class1" enz. zou ik niet aanraden, dan raak je binnen de kortste keren de draad kwijt. Kies gewoon iets beschrijvends.
quote:Op maandag 30 mei 2011 21:21 schreef n8n het volgende:
[..]
voor mobiele fok hebben we een ul waarin 2 li's zitten waarvan de geneste inhoud getoond moet worden na er op te klikken. Omdat het er 2 zijn moet de waarde van li 2 gereset worden als je op li 1 klikt. Ik wil de ul een class geven die verandert door de onclick op een van de li's.
<ul #nav .ingeklapt>
<li onclick(if #nav == .ingeklapt of .b-open maak #nav .a-open, if #nav == .a-open maak #nav .ingeklapt)/>
<li onclick(if #nav == .ingeklapt of .a-open maak #nav .b-open, if #nav == .b-open maak #nav .ingeklapt)/>
</ul>
zoiets, hoop dat het duidelijk is, weet bijna niks van js
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 | <html> <head> <style> .ingeklapt{ display:none; } .mp,li{ cursor:pointer; } </style> <script type="text/javascript"> var page = "a"; var dub = false function menu(e){ if(!dub && e.tagName == "DIV"){ var ncl = document.getElementById('nav'); if(ncl.className == 'ingeklapt'){ ncl.className = 'uitgeklapt'; }else if(ncl.className == 'uitgeklapt'){ ncl.className = 'ingeklapt'; } }else{ dub = false; } if(e.tagName == "LI"){ dub = true; if(page != e.value){ page = e.value; //en anderes acties } } } </script> </head> <body> <div class="mp" onclick="menu(this)"> dit is een menu text <ul class="ingeklapt" id="nav"> <li onclick="menu(this)" value="0">a</li> <li onclick="menu(this)" value="1">b</li> </ul> </div> </body> </html> |
Boot lickin, piss drinkin, fingerfriggin, tit tweakin, love bitin, arse lickin, shit stabbin, mother fuckin, spunk lovin, ball bustin, cock suckin, fist fuckin, lipsmackin, thirst quenchin, cool livin, ever givin USELESS MAN
Wil iemand mij alsjeblieft helpen? Ik wordt gek van dat ik niet begrijp wat er mis gaat.
Het komt er op neer dat ik een object wil doorgeven naar een andere functie. Dit object word zo aangemaakt:
Eigenlijk wil ik het hele object in één keer doorgeven, maar heb gemerkt dat dat niet kan (omdat er dan [object Object] in de HTML staat), dus was mijn plan de gegevens een voor een door te geven.
Wanneer ik meteen na het aanmaken van de marker dit uitvoer:
Krijg ik dit te zien:
Ik wil deze gegevens doorgeven doormiddel van een onClick:
Wanneer ik dan in die functie marker.position ontvang werkt mijn hele kaart niet meer, dus ontvang ik het als markerposition:
Als ik die markerposition dan weer alert krijg ik ineens een andere waarde te zien, namelijk:
Wat er dus gebeurt is dat alles voor de komma wordt weggehaald, maar ook de haakjes.
Wat doe ik verkeerd? En bovendien, hoe los ik dit op?
Het komt er op neer dat ik een object wil doorgeven naar een andere functie. Dit object word zo aangemaakt:
| 1 2 3 4 5 | var marker = new google.maps.Marker({ position: varPositie, map: map, icon: varIcon }); |
Eigenlijk wil ik het hele object in één keer doorgeven, maar heb gemerkt dat dat niet kan (omdat er dan [object Object] in de HTML staat), dus was mijn plan de gegevens een voor een door te geven.
Wanneer ik meteen na het aanmaken van de marker dit uitvoer:
| 1 | alert(marker.position); |
Krijg ik dit te zien:
| 1 | (52.080218106155456, 4.312434196472168) |
Ik wil deze gegevens doorgeven doormiddel van een onClick:
| 1 | <a href="#" onClick="markerinlijst2(' + marker.position + ')"> |
Wanneer ik dan in die functie marker.position ontvang werkt mijn hele kaart niet meer, dus ontvang ik het als markerposition:
| 1 2 3 | function markerinlijst2 (markerposition) { // Toegevoegde marker in ontzichtbare lijst plaatsen alert(markerposition); } |
Als ik die markerposition dan weer alert krijg ik ineens een andere waarde te zien, namelijk:
| 1 | 4.312434196472168 |
Wat er dus gebeurt is dat alles voor de komma wordt weggehaald, maar ook de haakjes.
Wat doe ik verkeerd? En bovendien, hoe los ik dit op?
Je kan gewoon objecten doorgeven en aflopen in Javascript hoor.
Dus je hoeft niet marker.position door te geven, kan ook gewoon marker zijn.
| 1 2 3 4 5 | <?php function foo(obj){ alert(obj.position); } ?> |
Dus je hoeft niet marker.position door te geven, kan ook gewoon marker zijn.
Dat je in die alert een rare waarde krijgt, komt omdat er iets misgaat met quotes en haakjes in je onclick.
eee7a201261dfdad9fdfe74277d27e68890cf0a220f41425870f2ca26e0521b0
Als ik het object gewoon meegeef krijg ik bij de eerste alert [object Object] te zien, en bij de tweede krijg ik geen alert, maar wel een error:quote:Op dinsdag 7 juni 2011 11:01 schreef Scorpie het volgende:
Je kan gewoon objecten doorgeven en aflopen in Javascript hoor.
[ code verwijderd ]
Dus je hoeft niet marker.position door te geven, kan ook gewoon marker zijn.
Komt dat dan ook door de quotes en haakjes zoals GlowMouse al zei?
Probeer onClick="markerinlijst2(marker)"
eee7a201261dfdad9fdfe74277d27e68890cf0a220f41425870f2ca26e0521b0
Was niet geheel wat ik bedoelde maar het heeft me wel geholpen zelf een functie te schrijven (mijn allereerstequote:
Op 
). heb het nu als volgt gedaan.js:
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 | <script type="text/javascript"> function toggle_fok(id) { var e = document.getElementById(id); if (e.className == 'ingeklapt') e.className = 'fok'; else if (e.className == 'user') e.className = 'fok'; else e.className = 'ingeklapt'; } function toggle_user(id) { var e = document.getElementById(id); if (e.className == 'ingeklapt') e.className = 'user'; else if (e.className == 'fok') e.className = 'user'; else e.className = 'ingeklapt'; } </script> |
html:
| 1 2 3 4 5 6 7 8 9 10 11 | <nav id="nav" class="ingeklapt"> <ul onclick="toggle_fok('nav');">toggle #fok <li>01</li> </ul> <ul id="user" onclick="toggle_user('nav');">toggle #user <li>02</li> </ul> </nav> |
edit, js kon korter:
| 1 2 3 4 | if (e.className == 'ingeklapt' || e.className == 'user') e.className = 'fok'; else e.className = 'ingeklapt'; |
[ Bericht 1% gewijzigd door n8n op 08-06-2011 07:16:04 ]
“Specialization is for insects”.—Robert Heinlein
| 1 2 | e.className = 'fok'; if (e.className != 'ingeklapt' && e.className != 'user') e.className = 'ingeklapt'; |
is dat niet hetzelfde als == ( || ) maar dan omgekeerd?quote:
voorbeeld: http://www.n8n.nl/temp/jsmenu.html
grijze tekst staat voor gesloten, groen voor open.
“Specialization is for insects”.—Robert Heinlein
Klopt, maar mijn functie is 2 regels, die van jou 4. Sowieso vind ik het altijd overzichtelijker om te beginnen met een uitgangssituatie en die te veranderen al naar gelieve de variabelen.quote:
[..]
is dat niet hetzelfde als == ( || ) maar dan omgekeerd?
voorbeeld: http://www.n8n.nl/temp/jsmenu.html
grijze tekst staat voor gesloten, groen voor open.
was even omschakelen door de andere manier van denken en niet bekend zijn met het schrijven van functies, ga het implementeren. Bedankt 
edit, krijg het nu opeens niet meer werkend, ga ondanks dat ik liever heb dat het me lukt genoegen nemen met 4 regels
edit2, wel in 2 regels lichte wijziging en het werkt:
[ Bericht 30% gewijzigd door n8n op 08-06-2011 09:41:51 ]
edit, krijg het nu opeens niet meer werkend, ga ondanks dat ik liever heb dat het me lukt genoegen nemen met 4 regels
edit2, wel in 2 regels lichte wijziging en het werkt:
| 1 2 | if (e.className != 'subsites') e.className = 'subsites'; else if (e.className != 'closed' && e.className != 'user') e.className = 'closed'; |
[ Bericht 30% gewijzigd door n8n op 08-06-2011 09:41:51 ]
“Specialization is for insects”.—Robert Heinlein
== en || (gelijk aan en OR) is precies het omgekeerde van != en && (niet gelijk aan en AND). Je zult het gedrag dus ook om moeten keren, of het hele statement moeten inverteren met een uitroepteken.
Het is allemaal gewoon wiskunde.
Het is allemaal gewoon wiskunde.
klopt kan dit stukje lezen en interpreteren nu, de aanpassing die ik heb gemaakt zijn de if op de 1e regel en van de if op de tweede regel heb ik een else if gemaakt, leek mij logisch en Safari dacht daar ook zo overquote:
== en || (gelijk aan en OR) is precies het omgekeerde van != en && (niet gelijk aan en AND). Je zult het gedrag dus ook om moeten keren, of het hele statement moeten inverteren met een uitroepteken.
Het is allemaal gewoon wiskunde.
Ben door deze kennismaking wel geprikkeld verder te gaan met javascript, leuk wel
“Specialization is for insects”.—Robert Heinlein
Ik vind die van jouw ook mooier maar ik zou zelf gaan voor:quote:
| 1 | (e.className != 'ingeklapt' && e.className != 'user') ? e.className = 'ingeklapt' : e.className = 'fok'; |
Beatus vir qui suffert tentationem.
PSN Rinzewind en Cadsuana Melaidhrin
Stellar Blade *O* Sea of Stars *O* Trails Daybreak *O*
PSN Rinzewind en Cadsuana Melaidhrin
Stellar Blade *O* Sea of Stars *O* Trails Daybreak *O*
Een zogenaamde ternary operator. Typ dat maar eens in op google.quote:
Ik wist trouwens niet dat je dat in Javascript ook kan gebruiken
Weer wat geleerd.
Mja zover wilde ik nou ook weer niet gaanquote:
[..]
Ik vind die van jouw ook mooier maar ik zou zelf gaan voor:
[ code verwijderd ]
Dan is de marker ineens undefined :squote:Op dinsdag 7 juni 2011 11:58 schreef GlowMouse het volgende:
Probeer onClick="markerinlijst2(marker)"
Als ik dit doe:
| 1 2 3 4 5 6 | alert(varPositie); document.getElementById("routepunten").innerHTML = document.getElementById("routepunten").innerHTML+'<img src="'+varIcon+'"/><a href="#" onClick="lijnplaatsen(varPositie)">'+ titel + '</a>'; function lijnplaatsen (varPositie) { // Toegevoegde marker in ontzichtbare lijst plaatsen alert(varPositie); } |
Dan krijg ik in de eerste alert "(52.080745582059585, 4.304838180541992)" te zien, en voor de tweede krijg ik de melding varPositie is not defined.
Wanneer ik echter dit doe:
| 1 2 | alert(varPositie); lijnplaatsen(varPositie); |
Dan kent de functie lijnplaatsen wel varPositie.
Kan iemand me helpen.
Ben bezig met een bestelproces met jQuery en localstorage.
Als je hebt besteld kom je op de pagina waar je een overzicht ziet van wat je hebt besteld. Probleem is dat de hele menukaart wordt getoond met daarachter hoeveel het is besteld (bijv Appels: 1, Banenen: 0). Nu wil ik dat slechts enkel wordt getoond wat is besteld, dus in deze alleen Appels: 1.
Op de overzichtspagina van wat er is besteld gebruik ik de volgende regels:
waar localStorage.getItem('Appels') dus uitleest hoeveel keer het is besteld.
Hoe kan ik dat daarin bakken? Is dat uberhaupt mogelijk?
Tijdens het bestelproces gebruik ik de volgende regel:
Ben bezig met een bestelproces met jQuery en localstorage.
Als je hebt besteld kom je op de pagina waar je een overzicht ziet van wat je hebt besteld. Probleem is dat de hele menukaart wordt getoond met daarachter hoeveel het is besteld (bijv Appels: 1, Banenen: 0). Nu wil ik dat slechts enkel wordt getoond wat is besteld, dus in deze alleen Appels: 1.
Op de overzichtspagina van wat er is besteld gebruik ik de volgende regels:
| 1 | document.write('<li>Appels: ' + localStorage.getItem('Appels') + '</li>' ); |
Hoe kan ik dat daarin bakken? Is dat uberhaupt mogelijk?
Tijdens het bestelproces gebruik ik de volgende regel:
| 1 | <input type="range" name="fruitappels" id="fruitappels" value="0" min="0" max="10" /> |
Op
Dat is geen probleem. Heb sowieso al alles opgebouwd op deze manier, waar ik al blij mee wasquote:
.Geen oplossing voor mijn probleem?
iets met
if(localStorage.getItem('Appels') > 0) {
.. jouw document.write
}
if(localStorage.getItem('Appels') > 0) {
.. jouw document.write
}
eee7a201261dfdad9fdfe74277d27e68890cf0a220f41425870f2ca26e0521b0
Somewhat related
quote:Today we’re making the first version of Swiffy available on Google Labs. You can upload a SWF file, and Swiffy will produce an HTML5 version which will run in modern browsers with a high level of SVG support such as Chrome and Safari.
Swiffy uses a compact JSON representation of the animation, which is rendered using SVG and a bit of HTML5 and CSS3. ActionScript 2.0 is also present in the JSON object, and is interpreted in JavaScript in the browser. This representation makes the Swiffy animations almost as compact as the original SWF files.
Dag mensen, ik heb een probleem met een gedownload script: http://www.dynamicdrive.com/dynamicindex14/fadeinslideshow.htm
Stand alone werkt het prima zowel op mijn eigen pc als online. Ik wil het echter gebruiken in Magento. Na wat prutsen is dat wel gelukt, alleen blijft het zwart in plaats van dat de plaatjes langskomen. Als ik in html een image toevoeg met dezelfde source werkt dat wel. En als ik dezelfde plaatjes toevoeg in het script buiten Magento werkt het ook. Heeft iemand enig idee waarom?
Stand alone werkt het prima zowel op mijn eigen pc als online. Ik wil het echter gebruiken in Magento. Na wat prutsen is dat wel gelukt, alleen blijft het zwart in plaats van dat de plaatjes langskomen. Als ik in html een image toevoeg met dezelfde source werkt dat wel. En als ik dezelfde plaatjes toevoeg in het script buiten Magento werkt het ook. Heeft iemand enig idee waarom?
Voor de jquery mensen die wel eens met positionering van 'popup divs' in de knoei zitten:
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 | jQuery.fn.center = function () { this.css("position","absolute"); var topPos; var widthPos; topPos = (($(window).height() - this.outerHeight()) / 2) + $(window).scrollTop(); widthPos = (($(window).width() - this.outerWidth()) / 2) + $(window).scrollLeft(); if(topPos<0){ topPos=0; } if(widthPos<0){ topPos=0; } this.css("top", topPos + "px"); this.css("left", widthPos + "px"); return this; } |
| 1 | $("#divId").center(); |
