[Javascript] voor dummies (deel 12)

dinsdag 16 augustus 2011 @ 17:50:36 #1

KomtTijd...

Hier kan je alle vragen stellen over Javascript en alles wat er mee te maken heeft.

Heb je een probleem, post dan ook even de code waar het probleem zit

Zo kunnen we je beter proberen te helpen.

Handige links:
Quircksmode Javascript
Javascript Cheat Sheet
_{Mis je een link? Geef even een gil in het topic}

Tutorials:
W3Schools Javascript
W3Schools AJAX

Let op! Verwijder je post niet.
Als je bijvoorbeeld zelf al een antwoord hebt gevonden, laat ons dan even weten hoe je het hebt opgelost.
Wel zo aardig.

zcflevo.nl

dinsdag 16 augustus 2011 @ 18:00:51 #2

GlowMouse

l'état, c'est moi

met jQuery gaat zoiets veel makkelijker.

eee7a201261dfdad9fdfe74277d27e68890cf0a220f41425870f2ca26e0521b0

woensdag 24 augustus 2011 @ 14:30:05 #3

Ikbenmijnwachtwoordkwijt

En mijn email klopte niet

Kent iemand hier ContentFlow?

http://www.jacksasylum.eu/ContentFlow/index.php

Ik krijg het niet aan de praat in IE, krijg steeds deze melding:

SCRIPT5022: Uitzondering geactiveerd maar niet afgehandeld
contentflow.js, regel 2 teken 21713

Op de site staat dat het hoort te werken, en ik heb de code gewoon zo geplaatst.

Iemand een idee?

woensdag 24 augustus 2011 @ 14:48:47 #4

KomtTijd...

Datsoort scripts hebben over het algemeen ook een niet-minified versie, probeer die eens. Dat debugt wat makkelijker.

zcflevo.nl

vrijdag 26 augustus 2011 @ 13:16:50 #5

Lamzak_

FC Twente!

Ik noteer: Ik heb geen idee hoe je het kan testen, of uberhaubt kan weten dat het werkt. Heeft javascript ook een syntax checker? Ik heb geen idee of dit uberhaubt wel klopt

Ik heb een button. En die moet een timer starten.

Die timer checkt elke 5 seconden of er iets veranderd is in de de database, met een maximale lengte van 90 seconden.

Nou had ik zoiets bedacht, maar het werkt volgens mij niet. (Ik bak ook niet veel van javascript)

(voor de test wil ik eigenlijk alleen even een alert laten oppoppen)

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

<input type="submit" style="width:120px; height:40px;" name="Genereren" id="Genereren" value="Genereren" onclick="timer()"/>

<script type="text/javascript">
function timer(){
  var interval = window.setInterval("checkPDF()" ,5000);
  window.setTimeout(timer()) {
  clearInterval(interval);
  alert('Interval klaar');
},90000);
}

function checkPDF(){
    alert('Interval!');
}
</script>

Enschede, onze stad! ons domein!

vrijdag 26 augustus 2011 @ 13:24:35 #6

MrMonkeyman

( ͡° ͜&#

Binnenkort maar eens wat met JSON gaan lopen experimenteren. Wil gaan knutselen met Flickr en Facebook API

( ͡° ͜ʖ ͡°)

vrijdag 26 augustus 2011 @ 14:28:25 #7

Lamzak_

FC Twente!

Ej, mensen, help! Dit is toch easy voor de gemiddelde javascript gure (2 posts up)

Enschede, onze stad! ons domein!

vrijdag 26 augustus 2011 @ 15:31:47 #8

GlowMouse

l'état, c'est moi

window.setTimeout(timer()) {
clearInterval(interval);
alert('Interval klaar');
},90000);
wordt:
window.setTimeout("clearInterval(interval); alert('Interval klaar');",90000);

eee7a201261dfdad9fdfe74277d27e68890cf0a220f41425870f2ca26e0521b0

vrijdag 26 augustus 2011 @ 15:33:21 #9

Lamzak_

FC Twente!

NVM!

[ Bericht 94% gewijzigd door Lamzak_ op 26-08-2011 17:06:55 ]

Enschede, onze stad! ons domein!

vrijdag 26 augustus 2011 @ 18:28:14 #10

KomtTijd...

quote:
Op vrijdag 26 augustus 2011 13:16 schreef Lamzak_ het volgende:
Ik noteer: Ik heb geen idee hoe je het kan testen, of uberhaubt kan weten dat het werkt. Heeft javascript ook een syntax checker? Ik heb geen idee of dit uberhaubt wel klopt

ctrl+shift+j

zcflevo.nl

dinsdag 30 augustus 2011 @ 17:45:07 #11

Crutch

Filantroop || Taalzwengel

Whut?

setInterval doet het niet.

Ik gebruik Chrome en kwam erachter dat JavaScript de functie niet herhaalt om de 3 seconden.
Dus ik test het met een simpel scriptje:

1
2
3
4
5
6
7

function test() {

alert('hoi');

}

setInterval(test(), 3000);

De code wordt één keer uitgevoerd en daar blijft het bij.

Je moeder is een hamster

dinsdag 30 augustus 2011 @ 17:47:56 #12

GlowMouse

l'état, c'est moi

Je ziet nu ook direct 'hoi' ipv na 3 seconden. Het eerste argument moet tussen ", anders voert hij test uit en voert hij elke 3 seconden uit wat test returnt.

eee7a201261dfdad9fdfe74277d27e68890cf0a220f41425870f2ca26e0521b0

dinsdag 30 augustus 2011 @ 17:48:17 #13

KomtTijd...

Denk dat je de haakjes weg moet halen bij de functieaanroep.

zcflevo.nl

dinsdag 30 augustus 2011 @ 17:49:58 #14

Crutch

Filantroop || Taalzwengel

Helden

functie zonder haakjes idd.

Je moeder is een hamster

zondag 4 september 2011 @ 11:15:47 #15

Ikbenmijnwachtwoordkwijt

En mijn email klopte niet

Weet iemand of je de tekst kan veranderen die in het bericht staat dat je krijgt wanneer Google Maps om je locatie vraagt?

dinsdag 6 september 2011 @ 17:39:03 #16

TheSeeker_NL

Damn fine coffee

Ik ben wat aan het oefenen met jQuery en ik stuit op het volgende probleem:

Ik wil graag gebruik maken van .tabs uit jQuery en met AJAX de remote content laden. Tergelijke tijd met het laden van de content wil ik de stylesheet veranderen. tabBlue moet blue.css krijgen, tabGreen - green.css en tabRed - red.css.

Met mijn huidige .js lukt het om de content en css te laden op een tab. Ga ik vervolgens naar een andere tab, dan lukt dit wel maar hij hide de oude tab niet. Er staan dus 2 pagina's aan content.

HTML

1
2
3
4
5
6
7
8
9
10

  <div id="nav">
            <ul>
            <li><a href="blue.html" id="blue" title="tabBlue"><span>Tab Blue</span></a></li>
            <li><a href="green.html" id="green" title="tabGreen"><span>Tab Green</span></a></li>
            <li><a href="red.html" id="red" title="tabRed"><span>Tab Red</span></a></li>
                 </ul>
</div>
<div id="tabBlue"></div>
<div id="tabGreen"></div>
<div id="tabRed"></div>

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20

$(document).ready(
    function(){
        $('div#nav > ul').tabs({
                                  fx: {
                                      opacity: 'toggle',
                                      duration: 'slow'
                                  }
                                  })
        $("#red").click(function() {
                                                    $("link").attr("href", "css/red.css");
                                                    });
        $("#green").click(function() {
                                                    $("link").attr("href", "css/green.css");
                                                    });
        $("#blue").click(function() {
                                                    $("link").attr("href", "css/green.css");
                                                    });
                                                      }

    );

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
26
27

body {
    background-color:#fff;
    margin:0;
    padding:0;
    font-family: Arial, Helvetica, sans-serif;
}

#nav ul {
    list-style:none;
    background:#000000;
    padding:5px;
}

#nav ul li {
    display:inline-block;

}

#nav ul li a {
    text-decoration: none;
    margin:0 20px;
    color:#ffffff;
}

.ui-tabs-hide {
    display:none;
}

dinsdag 6 september 2011 @ 17:44:19 #17

Crutch

Filantroop || Taalzwengel

Ik zie je ook nergens de .ui-tabs-hide class gebruiken.

Je moeder is een hamster

dinsdag 6 september 2011 @ 18:13:01 #18

TheSeeker_NL

Damn fine coffee

quote:
Op dinsdag 6 september 2011 17:44 schreef Crutch het volgende:
Ik zie je ook nergens de .ui-tabs-hide class gebruiken.

Ah, ik zie dat in de andere stylesheets ik die regel had weggelaten! In de eerste css dus wel. Bedankt want ik keek nu wel op de juiste plek

woensdag 7 september 2011 @ 15:57:35 #19

TheSeeker_NL

Damn fine coffee

Ik loop nu vast op iets anders. Het zou heel simpel moeten zijn maar hoe lang ik er ook mee stoei ik kom er niet uit.

De bedoeling is dat zodra ik op de a#tempDialogueOpen klik de div tmpDialogue zichtbaar wordt.

Ik doe iets fout want er gebeurd niks. Iemand die het wel ziet? Mijn dank is gigantisch.

HTML

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<link href="css/style.css" type="text/css" rel="stylesheet">
<script type='text/javascript' src='js/jQuery.js'></script>
<script type='text/javascript' src='js/jQueryUI.js'></script>
<script type="text/javascript" src="js/tabs.js"></script>
<script type="text/javascript" src="js/calender.js"></script>

</head>
<body>
  <div id="header">
      <div id="logo"></div>
      <div id="nav">
    <a href="" id="tmpDialogueOpen">Calender open</a>
    <a href="" id="tmpDialogueClose">Calender dicht</a>
        <ul>
            <li><a href="tab1.html" title="tab1">First Tab</a></li>
            <li><a href="tab2.html" title="tab2">Second Tab</a></li>
            <li><a href="tab3.html" title="tab3">Third Tab</a></li>
            <li><a href="tab4.html" title="tab4">Fourth Tab</a></li>
            <li><a href="tab5.html" title="tab5">Fifth Tab</a></li>
        </ul>
    </div>
</div>
<div id="container">
    <div id="main">
        <div id="tab1"></div>
        <div id="tab2"></div>
        <div id="tab3"></div>
        <div id="tab4"></div>
        <div id="tab5"></div>
    </div>
    <div id="sidebar">

    </div>
</div>
    <div id="tmpDialogue"><p>Calender</p></div>
</body>
</html>

CSS

1
2
3
4
5
6
7
8
9
10

#tmpDialogue {
    height:200px;
    width:200px;
    display:none;

}

div.tmpDialogueOn {
    display:block;
}

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20

// JavaScript Document

var tmpExample = {
    ready : function() {
        $('a#tmpDialogueOpen').click(
                        function($e) {
                              $e.preventDefault();
                              $('div#tmpDialogue').addClass('tmpDialogueOn');
                                      }

                          );
        $('a#tmpDialogueClose').click(
                        function($e) {
                            $e.preventDefault();
                            $('div#tmpDialogue').removeClass('tmpDialogueOn');
                        }
                        );
    }
};
$(document).ready(tmpExample.ready);

donderdag 8 september 2011 @ 07:41:53 #20

Nee ik heet geen JOE

1
2
3
4
5
6
7
8
9

$(document).ready(function() {
    $("#tmpDialogueOpen").click(function(){
        $("#tmpDialogue").show();
    });

    $("#tmpDialogueClose").click(function(){
        $("#tmpDialogue").hide();
    });
});

donderdag 8 september 2011 @ 08:45:06 #21

TheSeeker_NL

Damn fine coffee

quote:
Op donderdag 8 september 2011 07:41 schreef GI het volgende:

[ code verwijderd ]

Super! Het kan dus veel gemakkelijker. Ik had het ondertussen al wel zover dat er iets gebeurde met het toevoegen en weghalen van die extra class. Margin, Padding lukte wel maar Display, daar deed hij gek mee?

Hoe dan ook, in dit geval werkt jou oplossing perfect ik heb nog wel even de preventDefault toegevoegd want anders laat hij de pagina opnieuw en zie je maar een splitseconde het gewenste effect

Hartstikke bedankt.

donderdag 8 september 2011 @ 15:40:19 #22

RenRen-

Misschien kunnen jullie mij helpen, ik heb google analytics op een site gegooid, direct achter de /head-tag, zoals het moet.

Nu krijg ik te horen dat er een Javascript Error in de site zit:

"iets anders is, dat er een javascript-error in de site zit. In alle pagina.s"

1
2
3
4
5

Bericht: '{' wordt verwacht
Regel: 14
Teken: 15
Code: 0
URI: http://urlvandesite.nl

"Dat verwijst hiernaar:"

1
2
3
4
5
6
7
8
9

Nou zegt hij dat het komt door dat stukje onderin, Function. Maar die hele code kan ik niet terugvinden in mijn broncode. Weet één van jullie waar deze vandaan komt en hoe ik die op kan lossen? Ik ben niet zo bekend met Javascript, ik heb gewoon dat stukje code in de site gezet (Best een beetje van belang voor hun site).

Ik heb met IEtab de broncode bekeken in IE en FF, en in beiden zie ik deze code terug...

[ Bericht 1% gewijzigd door RenRen- op 08-09-2011 16:10:23 ]

donderdag 8 september 2011 @ 16:29:14 #23

Crutch

Filantroop || Taalzwengel

Moet er niet op z'n minst {} achter een functie staan?

Dus:

1	function() {}

Je moeder is een hamster

donderdag 8 september 2011 @ 16:30:20 #24

RenRen-

quote:
Op donderdag 8 september 2011 16:29 schreef Crutch het volgende:
Moet er niet op z'n minst {} achter een functie staan?

Dus:
[ code verwijderd ]

Die hele function staat niet in mijn code, wel in de bron maar niet in de code achter de schermen

Dus ik kan niets aan die function veranderen

donderdag 8 september 2011 @ 16:31:39 #25

KomtTijd...

Je bent de {literal} tags vergeten in je template. Smarty gaat over zijn nek.

zcflevo.nl

donderdag 8 september 2011 @ 16:32:33 #26

RenRen-

quote:
Op donderdag 8 september 2011 16:31 schreef KomtTijd... het volgende:
Je bent de {literal} tags vergeten in je template. Smarty gaat over zijn nek.

waar moet ik die plaatsen dan? Ervoor en erna?

donderdag 8 september 2011 @ 16:37:06 #27

Crutch

Filantroop || Taalzwengel

quote:
Op donderdag 8 september 2011 16:32 schreef RenRen- het volgende:

[..]

waar moet ik die plaatsen dan? Ervoor en erna?

Ach so.

Ja dan openen met {literal} en sluiten met {/literal}

http://www.smarty.net/docsv2/en/language.function.literal

Je moeder is een hamster

donderdag 8 september 2011 @ 16:40:05 #28

RenRen-

Voor <script> en na </script> toch?

Thanks, even vragen of hij er van af is nu

vrijdag 9 september 2011 @ 17:10:02 #29

TheSeeker_NL

Damn fine coffee

1
2
3
4
5

$(document).ready(function() {
    $("input#kleurKop").click(function(){
        $("#koptekst").addClass('rood');
    });
});

Kan iemand mij vertellen wat er mis is met dit mini stukje script? Ik wil gewoon een class toevoegen aan een <h1> element maar 't lukt niet.

vrijdag 9 september 2011 @ 17:15:32 #30

GlowMouse

l'état, c'est moi

1
2
3

$(document).ready(function() {
$("h1").addClass('rood');
});

eee7a201261dfdad9fdfe74277d27e68890cf0a220f41425870f2ca26e0521b0

vrijdag 9 september 2011 @ 17:17:05 #31

TheSeeker_NL

Damn fine coffee

quote:
Op vrijdag 9 september 2011 17:15 schreef GlowMouse het volgende:

[ code verwijderd ]

Okay bedankt voor je snelle antwoord maar ik wil dat 't pas gebeurd nadat de knop is ingedrukt input#kleurKop dus

vrijdag 9 september 2011 @ 17:22:49 #32

Crutch

Filantroop || Taalzwengel

quote:
Op vrijdag 9 september 2011 17:17 schreef TheSeeker_NL het volgende:

[..]

Okay bedankt voor je snelle antwoord maar ik wil dat 't pas gebeurd nadat de knop is ingedrukt input#kleurKop dus

Wat als je input weghaalt?

1
2
3

$("#kleurKop").click(function(){
$("#koptekst").addClass('rood');
});

Je moeder is een hamster

vrijdag 9 september 2011 @ 17:22:51 #33

GlowMouse

l'état, c'est moi

vervang #koptekst door h1? Of heeft de h1 het id koptekst?

eee7a201261dfdad9fdfe74277d27e68890cf0a220f41425870f2ca26e0521b0

vrijdag 9 september 2011 @ 17:27:34 #34

TheSeeker_NL

Damn fine coffee

1
2
3
4
5
6
7
8
9

<h1 id="koptekst">GROEN WORDT ROOD</h1>
<input type="button" name="rodeKleur" value="kleur" id="kleurKop" size="50" />

.rood {
color:rood;
}
#kleurKop {
margin-left:20px;
}

input weghalen helpt niet. En ja de h1 heeft id "koptekst" omdat ik niet elke h1 rood wil geven :-) Gewoon een simpele oefening voor mezelf maar ik loop steeds vast, ik vind de syntax toch erg lastig

vrijdag 9 september 2011 @ 17:30:40 #35

GlowMouse

l'état, c'est moi

url? en is jQuery wel geladen?

eee7a201261dfdad9fdfe74277d27e68890cf0a220f41425870f2ca26e0521b0

vrijdag 9 september 2011 @ 18:05:11 #36

TheSeeker_NL

Damn fine coffee

quote:
Op vrijdag 9 september 2011 17:30 schreef GlowMouse het volgende:
url? en is jQuery wel geladen?

Sorry was even boodschappen doen, ja jQuery is geladen. Test url is http://onzereis.com/simpelveld/index.html

zaterdag 10 september 2011 @ 00:14:52 #37

GlowMouse

l'état, c'est moi

De fout zit in css: color:rood; is geen Engels.

eee7a201261dfdad9fdfe74277d27e68890cf0a220f41425870f2ca26e0521b0

zaterdag 10 september 2011 @ 21:10:11 #38

ursel

"Het Is Hier Fantastisch!

Ik kom er niet helemaal uit volgens mij.

Ik wil graag gebruik gaan maken van de volgende drag en drop Jquery.
http://jqueryui.com/demos/droppable/#photo-manager

Deze Jquery in dit format krijg ik zo aan het werk binnen mijn applicatie. Echter is het de bedoeling dat ik een onbekend aantal drop plekken per pagina ga krijgen. Middels een loop creeer ik de opmaak daarvan.

Alleen lukt het me niet om de Jquery hier op aan te passen. Of alle blokken worden telkens tegelijk gehighlight als je erover heen gaat met een drag item. En dan wordt vervolgens het item onder alle blokken geplaatst.

Bedoeling is dus dat het item binnen het desbetreffende blok komt te staan.

Wat ik volgens mij moet doen is elk blok een eigen ID gaan geven en middels een class er voor zorgen dat hij droppable is.. Binnen de afhandeling zal ik dan ergens het ID moeten oprakelen ofzo.

Iemand die me hier verder in kan helpen?

zondag 11 september 2011 @ 18:12:24 #39

TheSeeker_NL

Damn fine coffee

quote:
Op zaterdag 10 september 2011 00:14 schreef GlowMouse het volgende:
De fout zit in css: color:rood; is geen Engels.

Dat meen je niet... pfff.. ik me helemaal kapot zoeken in de js, maak ik zo'n stom foutje. Mijn dank is groot

dinsdag 13 september 2011 @ 08:49:46 #40

TheSeeker_NL

Damn fine coffee

Kan je aan een .load() event eigenlijk een effect meegeven zoals .fadeIn:

$('#foto').load('paprika.html img').fadeIn("slow");

Ik wil namelijk graag dat de foto langzaam zichtbaar wordt maar dit lijkt niet te werken. Is daar een oplossing voor? Ik zit rustig aan te zoeken maar kwam nog niks tegen totdusverre.

dinsdag 13 september 2011 @ 08:53:33 #41

#ANONIEM

1
2
3

$('#foto').load('paprika.html img', function(){
$('#selector').fadeIn();
});

De 2e argument van load is een callback, in dit geval een anonieme functie, waarin je de fadeIn/out/effect doet. Deze callback wordt pas uitgevoerd nadat de load is voltooid. Wat jij deed was action chaining, maar dat werkt niet met een asynchrone load actie.

[ Bericht 41% gewijzigd door #ANONIEM op 13-09-2011 08:54:39 ]

dinsdag 13 september 2011 @ 09:01:55 #42

TheSeeker_NL

Damn fine coffee

quote:
Op dinsdag 13 september 2011 08:53 schreef Scorpie het volgende:

[ code verwijderd ]

De 2e argument van load is een callback, in dit geval een anonieme functie, waarin je de fadeIn/out/effect doet. Deze callback wordt pas uitgevoerd nadat de load is voltooid. Wat jij deed was action chaining, maar dat werkt niet met een asynchrone load actie.

Ah bedankt voor je uitleg daar ook bij, dit maakt mij heel blij :-)

dinsdag 13 september 2011 @ 10:38:45 #43

TheSeeker_NL

Damn fine coffee

@Scorpie

Het werkte niet meteen en ik ben er even mee gaan stoeien omdat ik je niet direct wilde lastig vallen maar toen bedacht ik me:

Met .load wordt de foto al geladen en getoond dus de .fadeIn() zul je niet zien omdat de foto er dan al is. Toen heb ik even .fadeOut() geprobeerd en dat werkte wel gewoon dus mijn conclusie is dan ook dat het niet aan de syntax ligt maar dat de code gewoon niet geschikt is voor wat ik voor ogen heb.

Ik wil dus de foto laden zonder direct te tonen, maar het met een fadeIn() doen. Moet ik dan omslachtig gaan doen door de eerst een .hide() te gebruiken en dan een .fadeIn()? Lijkt me dat er een logischere oplossing voor moet zijn.

dinsdag 13 september 2011 @ 11:31:59 #44

mschol

quote:
Op dinsdag 13 september 2011 10:38 schreef TheSeeker_NL het volgende:
@Scorpie

Het werkte niet meteen en ik ben er even mee gaan stoeien omdat ik je niet direct wilde lastig vallen maar toen bedacht ik me:

Met .load wordt de foto al geladen en getoond dus de .fadeIn() zul je niet zien omdat de foto er dan al is. Toen heb ik even .fadeOut() geprobeerd en dat werkte wel gewoon dus mijn conclusie is dan ook dat het niet aan de syntax ligt maar dat de code gewoon niet geschikt is voor wat ik voor ogen heb.

Ik wil dus de foto laden zonder direct te tonen, maar het met een fadeIn() doen. Moet ik dan omslachtig gaan doen door de eerst een .hide() te gebruiken en dan een .fadeIn()? Lijkt me dat er een logischere oplossing voor moet zijn.

geen held met JS (en kan nu eff niet snel eerst eff testen) maar probeer dit eens:

1	$('#content').load('paprika.html img', function() { $(this).fadeIn("slow"); }));

bron

dinsdag 13 september 2011 @ 11:47:35 #45

TheSeeker_NL

Damn fine coffee

quote:
Op dinsdag 13 september 2011 11:31 schreef mschol het volgende:

[..]

geen held met JS (en kan nu eff niet snel eerst eff testen) maar probeer dit eens:
[ code verwijderd ]

bron

Hmm het lijkt echt wel zo te moeten inderdaad maar om een of andere reden lukt het niet.
Ik had die comment daaronder ook al geprobeerd, dus de div waar de image heen gaat in de css op display:hidden gezet maar ook dat werkte niet.

Het plaatje wordt wel getoond maar niet met een fadeIn. Heel frustrerend.

Zou het kunnen komen door mijn overige script:

1
2
3
4
5
6
7
8
9
10
11
12

//    paprika //

    $("#paprika").click(function($e){
    $e.preventDefault();
    $('li').removeClass('zaaien oogsten');
    $("#apr").addClass("zaaien");
    $("#dec").addClass("oogsten");
    $('#foto').load('paprika.html img', function() { $(this).fadeIn("normal"); });
    $('#pictureText').load('paprika.html p');
    $("#koptekst").load('paprika.html h1');

                                   });

Het zal vast heel rommelig ogen maar ik ben ook maar lerende, vergeef me

edit:

Op deze manier lukt het wel maar dit lijkt me niet de bedoeling

1
2
3

$('#foto').load(paprika.html img', function(){
$(this).hide();
$(this).fadeIn("slow")});

[ Bericht 3% gewijzigd door TheSeeker_NL op 13-09-2011 16:29:24 ]

vrijdag 16 september 2011 @ 09:56:05 #46

Ikbenmijnwachtwoordkwijt

En mijn email klopte niet

Ik heb een scriptje gemaakt (met jquery) waarmee ik de hoogte van bepaalde divs bereken en dan de hoogte aan elkaar aanpas zodat het mooi eruit ziet.

Het script werkt gewoon goed, alleen er is een probleem.
Bij de eerste keer laden pakt hij niet de juiste gegevens, en dus ziet het er niet mooi uit.

Het gaat om deze code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18

$(document).ready(function() {
var loyaalcolumnheight = ($("#loyaalcolumn").height());
var gastvrijheidexpertisecolumnheight = ($("#gastvrijheidexpertisecolumn").height());
var gerelateerdeonderwerpenheight = ($("#gerelateerdeonderwerpen").height());

if (loyaalcolumnheight > gastvrijheidexpertisecolumnheight){
    var difference = loyaalcolumnheight - gastvrijheidexpertisecolumnheight;
    $("#gastvrijheidexpertisecolumn").height(gastvrijheidexpertisecolumnheight + difference);
    $("#gerelateerdeonderwerpenfix").height(gerelateerdeonderwerpenheight + difference + 31);
}

if (loyaalcolumnheight < gastvrijheidexpertisecolumnheight){
    var difference = gastvrijheidexpertisecolumnheight - loyaalcolumnheight;
    $("#loyaalcolumn").height(loyaalcolumnheight + difference);
    $("#gerelateerdeonderwerpenfix").height(gerelateerdeonderwerpenheight + 31);
}

});

Op deze pagina:

http://elearning.hotelsch(...)woord/338/klant.html

Het gaat dus om dat blauwe blok onder alle tekst.

Kan iemand mij uitleggen waarom de eerste keer een verkeerde hoogte wordt gepakt? Moet ik soms iets anders dan document.ready gebruiken?

vrijdag 16 september 2011 @ 10:44:35 #47

Ikbenmijnwachtwoordkwijt

En mijn email klopte niet

Nevermind, ik heb het probleem opgelost.

Ik heb er een timeout omheen gezet, hij pakt nu telkens de verkeerde hoogte dus heb ik gewoon de hoogte die erbij zou komen aangepast en nu gaat het telkens goed.

De code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24

setTimeout(function() {
var loyaalcolumnheight = ($("#loyaalcolumn").height());
console.log("loyaalcolumnheight: " + loyaalcolumnheight);
var gastvrijheidexpertisecolumnheight = ($("#gastvrijheidexpertisecolumn").height());
console.log("gastvrijheidexpertisecolumnheight: " + gastvrijheidexpertisecolumnheight);
var gerelateerdeonderwerpenheight = ($("#gerelateerdeonderwerpen").height());
console.log("gerelateerdeonderwerpenheight: " + gerelateerdeonderwerpenheight);

if (loyaalcolumnheight > gastvrijheidexpertisecolumnheight){
    var difference = loyaalcolumnheight - gastvrijheidexpertisecolumnheight;
    console.log("loyaalcolumnheight is groter dan gastvrijheidexpertisecolumnheight");
    console.log("het verschil is "+ difference + " px");
    $("#gastvrijheidexpertisecolumn").height(gastvrijheidexpertisecolumnheight + difference);
    $("#gerelateerdeonderwerpenfix").height(gerelateerdeonderwerpenheight + difference + 46);
}

if (loyaalcolumnheight < gastvrijheidexpertisecolumnheight){
    var difference = gastvrijheidexpertisecolumnheight - loyaalcolumnheight;
    console.log("loyaalcolumnheight is kleiner dan gastvrijheidexpertisecolumnheight");
    console.log("het verschil is "+ difference + " px");
    $("#loyaalcolumn").height(loyaalcolumnheight + difference);
    $("#gerelateerdeonderwerpenfix").height(gerelateerdeonderwerpenheight + 46);
}
}, 1000);

Toch bedankt voor wie mee leest.

vrijdag 16 september 2011 @ 11:54:03 #48

ViPeRII

It's a good day to die

Het lijkt er op of je code dan voor het uitlezen van de andere hoogtes al is uitgevoerd, en of die variabele is meegekomen.
Ligt het niet gewoon aan je volgorde?

-- ViPeRII --

vrijdag 16 september 2011 @ 15:31:10 #49

Chandler

Ik wil een IFRAME op 100% zetten maar dat wil niet met de standaard paramters... dus wil ik javascript gebruiken.

alle browsers werken goed behalve natuurlijk IE.

Die geeft op de volgende regel:
var the_height=document.getElementById('the_iframe').contentWindow.document.body.scrollHeight;

De volgende melding:
SCRIPT5: Access is denied.
index.html, line 18 character 1

Is hier een oplossing voor?

The people who lost my respect will never get a capital letter for their name again.
Like trump...

vrijdag 16 september 2011 @ 17:52:38 #50

KomtTijd...

Klinkt als een XSS beveiliging?

Is de iframe van het zelfde domein?

zcflevo.nl

zaterdag 17 september 2011 @ 04:01:16 #51

Chandler

Nee, is een google maps iframe!

Maar Chrome werkt wel naar behoren en gaat mij niet om de content maar wil gewoon de gehele iframe op 100%/100% hebben!

The people who lost my respect will never get a capital letter for their name again.
Like trump...

zaterdag 17 september 2011 @ 09:56:07 #52

PiRANiA

All thinking men are atheists.

Google maps blokkeert iframes sinds kort

.

Ben ik achter gekomen

Dag Google!

zaterdag 17 september 2011 @ 11:27:40 #53

Chandler

quote:
Op zaterdag 17 september 2011 09:56 schreef PiRANiA het volgende:
Google maps blokkeert iframes sinds kort .

Ben ik achter gekomen .

Dat is onzin, het werkt wel maar alleen in IE niet

ach het is al opgelost met CSS

maar weer een reden gevonden om GEEN ie te gebruiken!

[ Bericht 15% gewijzigd door Chandler op 17-09-2011 11:44:35 (gebruik zelf chrome/ff) ]

The people who lost my respect will never get a capital letter for their name again.
Like trump...

woensdag 21 september 2011 @ 23:54:40 #54

SlimShady

Hey, ik hoef niet zo nodig een apart topic, dus doe ik het hier.

Stel: er is een groot Javascript omgeving met daarin een kleine ruimte. In die kleine ruimte doet een script zelfstandig zijn ding.
Nou wil ik aan de grote omgeving doorgeven hoeveel actieve elementen bezig zijn in de kleine ruimte.
Nu heb ik wat advies nodig.

- Ik kan in de kleine ruimte de stand bijhouden hoeveel er actief zijn. En op het juiste moment dat getal doorgeven?
óf
- alleen een '(element) actief' of '(element) inactief' event doorgeven aan de grote omgeving. en die houdt bij hoeveel er wel actief zijn?

donderdag 22 september 2011 @ 00:01:41 #55

#ANONIEM

Ik snap het niet. Probeer je je scope uit te leggen ofzo?

donderdag 22 september 2011 @ 16:36:40 #56

MrMonkeyman

( ͡° ͜&#

Facebook + JS

( ͡° ͜ʖ ͡°)

dinsdag 27 september 2011 @ 13:11:56 #57

Cue_

Cuecumbergirl

Even iets kleins.

Ik heb een lijst met gegevens. Er zit een checkbox op elke regel om deze aan te vinken als je hem wilt verwijderen.

Ik roep met de knop 'delete' vervolgens een javascript op die de text van de status (die in die regel staat vermeld) veranderd naar 'deleted'
Om dit voor elke regel te doen die is aangevinkt gebruik ik t volgende:

1
2
3
4
5

function updateStatus(frm){
var array = [];
alert(frm.tobeprinted.length);
for (i = 0; i < frm.tobeprinted.length; i++)
if (frm.tobeprinted[i].checked){

Maar die tobeprinted (zo heet de checkbox).lenght werkt alleen als ik meer dan 2 regels in mijn lijst heb. Als ik 1 regel heb dan krijg ik een foutmelding dat tobeprinted.lenght leeg is of geen object.

iemand enig idee hoe op te lossen?

dinsdag 4 oktober 2011 @ 14:42:52 #58

Zixon

quote:
Op dinsdag 27 september 2011 13:11 schreef Cue_ het volgende:
Even iets kleins.

Ik heb een lijst met gegevens. Er zit een checkbox op elke regel om deze aan te vinken als je hem wilt verwijderen.

Ik roep met de knop 'delete' vervolgens een javascript op die de text van de status (die in die regel staat vermeld) veranderd naar 'deleted'
Om dit voor elke regel te doen die is aangevinkt gebruik ik t volgende:
[ code verwijderd ]

Maar die tobeprinted (zo heet de checkbox).lenght werkt alleen als ik meer dan 2 regels in mijn lijst heb. Als ik 1 regel heb dan krijg ik een foutmelding dat tobeprinted.lenght leeg is of geen object.

iemand enig idee hoe op te lossen?

1
2
3
4
5
6
7
8
9

for (i = 0; i < frm.elements.length; i++) {

    var el = frm.elements[i];

    if (el.name === 'tobeprinted' && el.checked) {

        alert(el.value);
    }
}

Of nog makkelijker als je jQuery wilt/kunt gebruiken:

1
2
3

$('input[name="tobeprinted"]:checked').each(function() {
alert(this.value);
});

woensdag 5 oktober 2011 @ 18:24:54 #59

Mirel

Mirel wil een bongophone.

Ik wilde in mijn webaccess outlook client (gewoon via de browser dus) alle berichten op een pagina selecteren om ze dan te verwijderen. Ik vond het volgende scriptje:

1	javascript:var f=document.activeElement.childNodes[1].contentDocument;var c=f.all['MsgID'];var i;for(i=0;i<c.length;i++){c[i].click();}

Het werkt in ieder geval in Chrome. Ik moet dan wel F5'en na het verwijderen van een pagina vol met berichten als ik het nog een keer wil gebruiken, maar het geeft niet. Ik heb de code onder een bookmark gedaan om het proces wat te versnellen.

Nu ging ik even met de muis over de delete knop en zag deze javascript code staan:

1	javascript:SetCmd(document.msgViewer.CmdDelete.value);

Ik heb deze ook proberen uit te voeren, maar het werkt niet. Ik weet helemaal niks van javascript. Heb het geprobeerd te koppelen aan de bovenste, en ook om een deel van de bovenste (tot aan contentDocument;var stukje) er voor te zetten, maar dat werkte niet zo gek genoeg ook niet

Weet iemand hoe ik de verwijderen knop ook kan bereiken op deze manier? Het zou het verwijderproces van m'n schoolmailbox een stuk sneller maken. Ik kreeg vandaag meldingen dat ik niet meer berichten kon versturen omdat m'n mailbox vol was en ik heb geen zin om 37 pagina's op de stomme manier te verwijderen.

When all else fails, you always have delusion.

donderdag 6 oktober 2011 @ 10:38:31 #60

Cue_

Cuecumbergirl

Hij doet het

Is er trouwens ook een logische reden waarom hij de frm.tobeprinted.length niet pakt als er 1 regel is?

[ Bericht 58% gewijzigd door Cue_ op 06-10-2011 10:53:50 ]

donderdag 6 oktober 2011 @ 16:52:39 #61

ursel

"Het Is Hier Fantastisch!

Geen flauw idee of tie hier moet of bij de buren ([PHP/(My)SQL] voor dummies #94)

Probeer het hier maar.

Ik ben bezig met wat Jquery. Nu weet ik een gegeven ID en wil de tekst van de h5 tag die eronder hangt graag terug zien.

1
2
3

<div id="id1">
<h5>Tekst</h5>
</div>

Nu dacht ik zelf met de volgende wel er te komen, maar dat klopt dus niet.

1	$(this.id).find('h5').text();

[EDIT]
Soms niet te snel vragen.

Al opgelost

1	$("#" + this.id).find('h5').text();

[ Bericht 14% gewijzigd door ursel op 06-10-2011 17:07:38 ]

donderdag 13 oktober 2011 @ 15:06:13 #62

#ANONIEM

quote:
Op donderdag 6 oktober 2011 16:52 schreef ursel het volgende:
Geen flauw idee of tie hier moet of bij de buren ([PHP/(My)SQL] voor dummies #94)
Probeer het hier maar.

Ik ben bezig met wat Jquery. Nu weet ik een gegeven ID en wil de tekst van de h5 tag die eronder hangt graag terug zien.
[ code verwijderd ]

Nu dacht ik zelf met de volgende wel er te komen, maar dat klopt dus niet.
[ code verwijderd ]

[EDIT]
Soms niet te snel vragen.

Al opgelost
[ code verwijderd ]

Ik zou hem zo doen:

1
2
3
4
5

<?php

$("div#" + this.id).find('h5').text();

?>

of nog korter:

1
2
3
4
5

<?php

$("div#"+this.id+" h5").text();

?>

Hoe scherper je je selectors maakt, hoe sneller het performed.

donderdag 13 oktober 2011 @ 15:15:13 #63

ursel

"Het Is Hier Fantastisch!

quote:
Op donderdag 13 oktober 2011 15:06 schreef Scorpie het volgende:

[..]

Ik zou hem zo doen:
[ code verwijderd ]

of nog korter:
[ code verwijderd ]

Hoe scherper je je selectors maakt, hoe sneller het performed.

Ahh.. ok, Gaan we wijzigen dan. Bedankt voor de tip

vrijdag 14 oktober 2011 @ 07:30:48 #64

Light

quote:
Op donderdag 13 oktober 2011 15:06 schreef Scorpie het volgende:

[..]

Ik zou hem zo doen:
[ code verwijderd ]

of nog korter:
[ code verwijderd ]

Hoe scherper je je selectors maakt, hoe sneller het performed.

Ik zou het zo doen:

1	$("#" + this.id).find('h5').text();

Omdat $() alleen een id meekrijgt, kan jQuery dat zelf optimaliseren. Er wordt dan intern getElementById() gebruikt, en sneller dan dat krijg je het niet.

fokstok.nl

woensdag 19 oktober 2011 @ 11:29:08 #65

Koopsie

Very nice

Welke lightbox raden jullie mij aan om facebook comment box in te bakken?

"Dubbelop alsof ik een quote citeer"

woensdag 19 oktober 2011 @ 20:42:51 #66

ursel

"Het Is Hier Fantastisch!

quote:
Op vrijdag 14 oktober 2011 07:30 schreef Light het volgende:

[..]

Ik zou het zo doen:
[ code verwijderd ]

Omdat $() alleen een id meekrijgt, kan jQuery dat zelf optimaliseren. Er wordt dan intern getElementById() gebruikt, en sneller dan dat krijg je het niet.

Heb ik het dus toch goed.

Even (wss simpele

) vraag. Als ik zeg maar wat standaard functies wil maken die ik in een eigen library wil plaatsen, wat moet ik daar exact voor doen. Alleen de js code in een js file plaatsen en daarin functies aanmaken werkt in ieder geval niet.

SPOILER
Om spoilers te kunnen lezen moet je zijn ingelogd. Je moet je daarvoor eerst gratis Registreren. Ook kun je spoilers niet lezen als je een ban hebt.

woensdag 19 oktober 2011 @ 20:51:14 #67

#ANONIEM

quote:
Op vrijdag 14 oktober 2011 07:30 schreef Light het volgende:

[..]

Ik zou het zo doen:
[ code verwijderd ]

Omdat $() alleen een id meekrijgt, kan jQuery dat zelf optimaliseren. Er wordt dan intern getElementById() gebruikt, en sneller dan dat krijg je het niet.

Hm, toch wel:

http://stackoverflow.com/(...)d-elements-in-jquery

getElementsByClassName is het snelst, maar ik wist dus niet dat ze in 1.4+ de selection engine hebben aangepast.

woensdag 19 oktober 2011 @ 20:51:54 #68

#ANONIEM

quote:
Op woensdag 19 oktober 2011 20:42 schreef ursel het volgende:

[..]

Heb ik het dus toch goed.

Even (wss simpele ) vraag. Als ik zeg maar wat standaard functies wil maken die ik in een eigen library wil plaatsen, wat moet ik daar exact voor doen. Alleen de js code in een js file plaatsen en daarin functies aanmaken werkt in ieder geval niet.
SPOILER
Om spoilers te kunnen lezen moet je zijn ingelogd. Je moet je daarvoor eerst gratis Registreren. Ook kun je spoilers niet lezen als je een ban hebt.

Include je de javascript file wel?

woensdag 19 oktober 2011 @ 20:58:03 #69

ursel

"Het Is Hier Fantastisch!

quote:
Op woensdag 19 oktober 2011 20:51 schreef Scorpie het volgende:

[..]

Include je de javascript file wel?

Ga het voor de zekerheid even nog testen. Na al dat geklooi ben ik nergens meer zeker van.

Laten we het voorlopig nog wel op ja houden.

[edit]
Zo'n pokke haakje vergeten.

woensdag 19 oktober 2011 @ 21:00:17 #70

GlowMouse

l'état, c'est moi

quote:
Op woensdag 19 oktober 2011 20:51 schreef Scorpie het volgende:

[..]

Hm, toch wel:

http://stackoverflow.com/(...)d-elements-in-jquery

getElementsByClassName is het snelst, maar ik wist dus niet dat ze in 1.4+ de selection engine hebben aangepast.

Dat is alleen daar omdat wat je wilt matchen geen id heeft.
Ik vraag me af of $(this) niet sneller is. Het is in ieder geval leesbaarder.

eee7a201261dfdad9fdfe74277d27e68890cf0a220f41425870f2ca26e0521b0

woensdag 19 oktober 2011 @ 21:26:42 #71

ursel

"Het Is Hier Fantastisch!

Kan het kloppen dat een javascript functie niet met can mag beginnen?

Als in canBuy?

[edit]
ligt blijkbaar aan deze gehele naam. Een d erachter (canBuyd) doet die wel.

Nou ben ik nog niet zo gek lang met javascript bezig, maar kan iemand mij deze logica uitleggen?

[ Bericht 51% gewijzigd door ursel op 19-10-2011 21:43:12 ]

woensdag 19 oktober 2011 @ 21:46:15 #72

#ANONIEM

Ehm ik zal zo even kijken maar post de niet werkende functie eens?

woensdag 19 oktober 2011 @ 21:49:32 #73

ursel

"Het Is Hier Fantastisch!

quote:
Op woensdag 19 oktober 2011 21:46 schreef Scorpie het volgende:
Ehm ik zal zo even kijken maar post de niet werkende functie eens?

Als ik onderstaande 3 aanroep voert die er maar 2 uit. CanBuy niet. Die slaat die gewoon over. Geen melding of iets.

En maak ik er canBuyd van doet die het wel.

SPOILER
Om spoilers te kunnen lezen moet je zijn ingelogd. Je moet je daarvoor eerst gratis Registreren. Ook kun je spoilers niet lezen als je een ban hebt.

1
2
3
4
5
6
7
8
9
10
11
12
13
14

Forum Opties
Forumhop:
Hop naar:	(afkorting, bv 'KLB')

» digital corner

» development

» digital corner

» development