[Javascript] voor dummies (deel 10)

Index

» digital corner

» development

actieve topics nieuwe topics
abonnement Unibet Coolblue Bitvavo
  donderdag 7 oktober 2010 @ 12:55:53 #181
281927 mcf
The end is the beginning.
pi_87281578
quote:
Op donderdag 7 oktober 2010 12:52 schreef FastFox91 het volgende:
Momentje googlen naar andere methode:
[ code verwijderd ]


Nice, thx bro
pi_87281582
Heb je iets aan deze pagina?
fokstok.nl
pi_87281593
quote:
Op donderdag 7 oktober 2010 12:50 schreef mcf het volgende:
Geen, firefox laat ook letters toe, en niet alleen nummers..
En hoever was je met debuggen?

De functie wordt wel uitgevoerd?
zcflevo.nl
pi_87281663
Ook belangrijk: vertrouw niet volledig op die functie, maar haal er serverside ook een controle overheen.
fokstok.nl
  zondag 24 oktober 2010 @ 14:56:22 #185
118585 Crutch
Filantroop || Taalzwengel
pi_87897300
Stel:

Ik embed een Youtube-filmpje op een HTML-pagina.
Vervolgens druk op op pauze.
Kan ik dan met JavaScript het tijdstip op de tijdlijn achterhalen en in een <input type="text"> plaatsen?
Je moeder is een hamster
pi_87898444
http://code.google.com/in(...)s_api_reference.html
Met onStateChange vang je de status op, als dat 2 is pak je de tijd met player.getCurrentTime() en dan moet je die waarde in de input.value stoppen.
  zondag 24 oktober 2010 @ 15:51:16 #187
118585 Crutch
Filantroop || Taalzwengel
pi_87899125
quote:
1.gif Op zondag 24 oktober 2010 15:31 schreef FastFox91 het volgende:
http://code.google.com/in(...)s_api_reference.html
Met onStateChange vang je de status op, als dat 2 is pak je de tijd met player.getCurrentTime() en dan moet je die waarde in de input.value stoppen.
Ah cool, thanks.
Ik krijg de tijd terug in seconden, dus nu moet ik even kijken of ik dat kan omzetten in minuten en seconden.
Je moeder is een hamster
  zondag 24 oktober 2010 @ 16:01:24 #188
118585 Crutch
Filantroop || Taalzwengel
pi_87899606
LOL!

Dit werkt:
1
2
3
4
5
6
7
8
9
10
11
12
13
14		function deTijd() {
      var tijd = Math.round(ytplayer.getCurrentTime());
      var minuten = 0;
      var seconden = 0;
      var actueleTijd;
          while (tijd > 60) {
        minuten ++;
        tijd -= 60;
        }
      actueleTijd = minuten + ':' + tijd;
      
      
      alert(actueleTijd);
      }
O-) Trotse prutser hier.
Je moeder is een hamster
  zondag 24 oktober 2010 @ 16:06:21 #189
118585 Crutch
Filantroop || Taalzwengel
pi_87899830
Correctie:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21		 function deTijd() {
      var tijd = Math.round(ytplayer.getCurrentTime());
      var minuten = 0;
      var seconden = 0;
      var actueleTijd;
          while (tijd > 60) {
        minuten ++;
        tijd -= 60;
        }
        
        if (tijd < 10) {
        seconden = '0' + tijd;
        }
        else {
        seconden = tijd;
        } 
      actueleTijd = minuten + ':' + seconden;
      
      
      alert(actueleTijd);
      }
Je moeder is een hamster
pi_87903239
Dat kan makkelijker. Je kan het aantal secondes delen door 60 en afronden naar beneden. Dan heb je het aantal hele minuten. Het aantal overige secondes krijg je door het totaal aantal secondes modulo 60 te doen.
Succes met prutsen. :P
pi_88136545
Dag allemaal, voor een eigen versie van mijn forum ben ik nu zelf ook een topic gallerij aan het maken en op zich wil het best lukken hoor. Via jQuery alle plaatjes uitlezen van externe hosters en deze resizen en in een DIV plaatsen. Maar nu zit ik met een probleem dat mijn scrollbars gewoon weer verkeerd komen.

Hoe kan dit? mijn code + gebruik van fok plaatjes is.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38		<!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=iso-8859-1" />

    <style type="text/css">

#photosDiv {
width: 677px;
height: 141px;
background:#000000;
overflow-y:hidden;
overflow-x:scroll; 
min-width: 667px;
white-space:nowrap;
} 

#photos {
width: 100%;
height: 141px;
background:#000000;
text-align:left;
white-space:nowrap;
}

#photos img {
display:block;
padding: 0px;
border: 2px solid #ffffff;
margin: 5px;
float:left;
} 
#photos img:hover {
border: 2px solid #000;
background: #fff;
} 

    </style>

Javascript gedeelte
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		    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>

    <script type="text/javascript">
homeURL = 'http://localhost/';
maxThumbSize = 80;

$(document).ready(function() 
{
    $('#btn').click(function() 
    {
        $("#photos").empty();

        $('img').each(function() 
        {
            if ($(this).is('[src$=.gif],[src$=.Gif],[src$=.GIF],[src$=.jpg],[src$=.Jpg],[src$=.JPG],[src$=.png],[src$=.Png],[src$=.PNG]'))
            {
                if ($(this).attr('src').substring(0, homeURL.length) != homeURL)
                {
                    newThumbHeight = 0;
                    newThumbWidth = 0;
                    fact = 0;
                    
                    if ($(this).attr('width') > $(this).attr('height'))
                    {
                        fact = $(this).attr('width') / maxThumbSize;
                        newThumbHeight = Math.floor($(this).attr('height') / fact);
                        newThumbWidth = maxThumbSize;
                    }
                    else
                    {
                        fact = $(this).attr('width') / maxThumbSize;
                        newThumbHeight = maxThumbSize;
                        newThumbWidth = Math.floor($(this).attr('width') / fact);
                    }
    
                    $("#photos").append('<img src="' + $(this).attr('src') + '" width="' + newThumbWidth + '" height="' + newThumbHeight + '" />');
                }
            }
        });

    });
});

    </script>

overige 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		</head>
<body>

<div id="photosDiv">
    <div id="photos">
WHAHAAWHAHAAWHAHAAWHAHAAWHAHAAWHAHAAWHAHAAWHAHAAWHAHAAWHAHAAWHAHAAWHAHAAWHAHAAWHAHAAWHAHAAWHAHAAWHAHAAWHAHAAWHAHAAWHAHAAWHAHAAWHAHAAWHAHAAWHAHAAWHAHAAWHAHAAWHAHAAWHAHAAWHAHAAWHAHAAWHAHAAWHAHAA
    </div>
</div>

<input id="btn" type="button" value="Maak gallerij" />
<br />

<img src="http://images.fok.nl/fp/icons/icon_politie1.jpg" /><br />
<img src="http://i.fokzine.net/usericons/54884/leslieavater.gif" /><br />
<img src="http://i.fokzine.net/usericons/205909/catty20.gif" /><br />
<img src="http://i.fokzine.net/upload/10/10/101030_15080_img-301010-025.onlineBild_1288432038.jpg" /><br />
<img src="http://i.fokzine.net/upload/10/10/101030_15080_img-301010-010.onlineBild_1288426893.jpg" /><br />
<img src="http://images.fok.nl/fp/icons/icon_algemeen5.jpg" /><br />
<img src="http://i.fokzine.net/upload/091211_195885_icon_museum2.jpg" /><br />
<img src="http://images.fok.nl/fp/icons/icon_onderwijs3.jpg" /><br />
<img src="http://i.fokzine.net/upload/081116_47501_icon_nederland1.jpg" /><br />
<img src="http://i.fokzine.net/upload/10/10/101030_112339_novum.10-30-2010.0112_1288423294.jpg" /><br />
<img src="http://i.fokzine.net/upload/10/10/101030_112339_img-291010-416.onlineBild_1288411042.jpg" /><br />
<img src="http://i.fokzine.net/upload/081116_47501_icon_internationaal3.jpg" /><br />
<img src="http://i.fok.nl/fp/icons/icoon_privacy01.jpg" /><br />

</body>
</html>

Ik heb overal al gekeken maar kan eingelijk niets vinden :{

[ Bericht 11% gewijzigd door Chandler op 31-10-2010 11:13:30 (mooier ontwerp) ]
The people who lost my respect will never get a capital letter for their name again.
Like trump...
pi_88167189
Please iemand ?
The people who lost my respect will never get a capital letter for their name again.
Like trump...
pi_88167499
quote:
15s.gif Op zaterdag 30 oktober 2010 12:10 schreef Chandler het volgende:
Dag allemaal, voor een eigen versie van mijn forum ben ik nu zelf ook een topic gallerij aan het maken en op zich wil het best lukken hoor. Via jQuery alle plaatjes uitlezen van externe hosters en deze resizen en in een DIV plaatsen. Maar nu zit ik met een probleem dat mijn scrollbars gewoon weer verkeerd komen.
Hoe komen die scrollbalken dan, en hoe had je ze willen hebben?
fokstok.nl
pi_88171842
Hoi Light;

Ik wil een horizontale balk hebben als de images > breedte van het scherm.. maar op een of andere manier krijg ik dat niet voor elkaar. Ook zou ik graag comments willen hebben op mijn JS code aangezien ik een beetje prutser ben :)
The people who lost my respect will never get a capital letter for their name again.
Like trump...
pi_88194889
quote:
14s.gif Op zondag 31 oktober 2010 13:50 schreef Chandler het volgende:
Hoi Light;

Ik wil een horizontale balk hebben als de images > breedte van het scherm.. maar op een of andere manier krijg ik dat niet voor elkaar.
Dan moet je zorgen dat de div #photos breed genoeg is voor de foto's die je erin zet.
quote:
Ook zou ik graag comments willen hebben op mijn JS code aangezien ik een beetje prutser ben :)
Op zich ziet het er wel redelijk uit, maar ik mis nog een stukje code waarmee je voorkomt dat kleine plaatjes in de gallery verschijnen. Als iemand een linkje plaatst naar :) dan wil je niet dat het in de gallery verschijnt.
smile.gif
fokstok.nl
pi_88199408
quote:
1s.gif Op zondag 31 oktober 2010 23:17 schreef Light het volgende:

Dan moet je zorgen dat de div #photos breed genoeg is voor de foto's die je erin zet.
Volgens mij is die breed genoeg want als je het scriptje probeert zie je eerst een hele lange tekst. Pas als ik op mijn button click om alle afbeeldingen in de gallerij te zetten dan verdwijnt de scroll balk

quote:
Op zich ziet het er wel redelijk uit, maar ik mis nog een stukje code waarmee je voorkomt dat kleine plaatjes in de gallery verschijnen. Als iemand een linkje plaatst naar :) dan wil je niet dat het in de gallery verschijnt.
[ afbeelding ]
True, daar ga ik even mee spelen!
The people who lost my respect will never get a capital letter for their name again.
Like trump...
pi_88205866
quote:
1s.gif Op maandag 1 november 2010 08:34 schreef Chandler het volgende:

Volgens mij is die breed genoeg want als je het scriptje probeert zie je eerst een hele lange tekst. Pas als ik op mijn button click om alle afbeeldingen in de gallerij te zetten dan verdwijnt de scroll balk
De div #photos heeft een breedte van 100% (volgens de css). Dat is 100% van de omhullende div, die is 677 px breed. Dat je een scrollbalk krijgt als je een lange onzintekst zonder spaties invoert, komt enkel omdat overflow op auto staat en de regel niet kan worden afgebroken. Sowieso weet je vooraf nooit hoeveel plaatjes er in #photos komen en hoe breed die plaatjes zijn, dus je kunt #photos geen juiste breedte geven. Die breedte van 100% is een leuke beginwaarde, maar zeker geen eindwaarde.
fokstok.nl
pi_88212300
Ok light, maar je zou denken dat als het voorbeeld met tekst wel scrollt en met plaatjes weer niet?

Zie voorbeeld: http://www.bruggema.nl/lgb/test123.html
The people who lost my respect will never get a capital letter for their name again.
Like trump...
pi_88215006
quote:
1s.gif Op maandag 1 november 2010 16:01 schreef Chandler het volgende:
Ok light, maar je zou denken dat als het voorbeeld met tekst wel scrollt en met plaatjes weer niet?
Als je die tekst niet zo idioot lang maakt (zet er eens wat spaties in) krijg je met tekst ook geen scrollbalk.
quote:
Zie voorbeeld: http://www.bruggema.nl/lgb/test123.html
Die doet het niet. De plaatjes komen niet in de zwarte balk, de tekst verdwijnt wel.
fokstok.nl
pi_88226495
@Light; hij werkt wel in IE & Chrome? :D al snap ik niet waarom hij niet in firefox werkt!

En als je plaatjes direct naast elkaar zet zou het moeten werken of zou ik nou juist die plaatjes weer in divs zetten? hoe doet fok dat?
The people who lost my respect will never get a capital letter for their name again.
Like trump...
pi_88228403
quote:
16s.gif Op maandag 1 november 2010 21:27 schreef Chandler het volgende:
@Light; hij werkt wel in IE & Chrome? :D al snap ik niet waarom hij niet in firefox werkt!
Ik ook niet, ik constateer alleen maar. :)
quote:
En als je plaatjes direct naast elkaar zet zou het moeten werken of zou ik nou juist die plaatjes weer in divs zetten? hoe doet fok dat?
Zo te zien met een tabel. En plaatjes naast elkaar, al dan niet in een div, komen nog steeds onder elkaar als er niet genoeg ruimte is om naast elkaar komen.
fokstok.nl
pi_88236447
Lol, een tabel lost het scrollbar probleem op! :D al snap ik niet waarom ik in firefox nog steeds geen afbeeldingen zie? :X
The people who lost my respect will never get a capital letter for their name again.
Like trump...
pi_88263645
Ik heb de versie geupdated zodat hij een minimum aan width/height aanhoudt, echter kan ik maar niet achter halen waar het probleem m.b.t. firefox zit... lijkt wel of het een jquery probleem is :{ krijg dit als foutcode.

1
2
3		Waarschuwing: ‘.’ gevonden voor waarde in attribuutselector waar identificator of string verwacht.
Bronbestand: file:///C:/test123.html
Regel: 0

en dat meerdere malen :{
The people who lost my respect will never get a capital letter for their name again.
Like trump...
pi_88272591
quote:
5s.gif Op dinsdag 2 november 2010 21:03 schreef Chandler het volgende:
Ik heb de versie geupdated zodat hij een minimum aan width/height aanhoudt, echter kan ik maar niet achter halen waar het probleem m.b.t. firefox zit... lijkt wel of het een jquery probleem is :{ krijg dit als foutcode.
[ code verwijderd ]

en dat meerdere malen :{
Het gaat mis op de blokjes [src$=.gif], daar moet je wat quotes bijzetten. Maar het is geen handige methode, want je mist nog best veel mogelijke extensies.

Je javascriptcode een beetje aangepast (en nu werkend in Firefox)
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		homeURL = 'http://localhost/';
maxThumbSize = 80;
minImageSize = 30;

validExtensions = ['gif', 'jpg', 'png'];

$(document).ready(function()
{
    $('#btn').click(function()
    {
        $("#photos").empty();
        $("#photos").append("<table><tr>");

        $('img').each(function()
        {
            src = $(this).attr('src');
            ext = src.substring(src.lastIndexOf('.', src) + 1).toLowerCase();

            if($.inArray(ext, validExtensions))
            {
                if ($(this).attr('src').substring(0, homeURL.length) != homeURL)
                {
                    if ($(this).attr('width') > minImageSize ||
                        $(this).attr('height') > minImageSize)
                        {
                        newThumbHeight = 0;
                        newThumbWidth = 0;
                        fact = 0;

                        if ($(this).attr('width') > $(this).attr('height'))
                        {
                            fact = $(this).attr('width') / maxThumbSize;
                            newThumbHeight = Math.floor($(this).attr('height') / fact);
                            newThumbWidth = maxThumbSize;
                        }
                        else
                        {
                            fact = $(this).attr('width') / maxThumbSize;
                            newThumbHeight = maxThumbSize;
                            newThumbWidth = Math.floor($(this).attr('width') / fact);
                        }

                        $("#photos").append('<td><img src="' + $(this).attr('src') + '" width="' + newThumbWidth + '" height="' + newThumbHeight + '" /><br /><a href="' + $(this).attr('src') + '" target="_blank">>></a></td>');
                    }
                }
            }
        });

        $("#photos").append("</tr></table>");
    });
});
Zoek de verschillen :)
fokstok.nl
pi_88276015
Tnx Light! ik zie de verschillen en het is mij geheel duidelijk!
The people who lost my respect will never get a capital letter for their name again.
Like trump...
pi_88355633
Ik schaam me diep dat ik deze vraag hier uberhaupt stel, en ik ben er zelf ook heftig op tegen, maar helaas is de klant koning en zal ik het toch moeten proberen. Here goes:
De klant wil graag dat op het moment dat de gebruiker de pagina sluit, of wegnavigeert, er een popup (in de vorm van een jQuery dialogbox) verschijnt waarin de gebruiker gevraagd wordt of hij/zij geabonneerd wil worden op de nieuwsbrief (nogmaals: :r ).
Het uitvoeren van javascriptcode op het moment dat de gebruiker wegnavigeert is niet zo lastig, maar is het ook mogelijk te voorkomen dat de unload van de pagina daadwerkelijk plaats vind?
pi_88361106
quote:
1s.gif Op vrijdag 5 november 2010 10:28 schreef Intrepidity het volgende:
Ik schaam me diep dat ik deze vraag hier uberhaupt stel, en ik ben er zelf ook heftig op tegen, maar helaas is de klant koning en zal ik het toch moeten proberen. Here goes:
De klant wil graag dat op het moment dat de gebruiker de pagina sluit, of wegnavigeert, er een popup (in de vorm van een jQuery dialogbox) verschijnt waarin de gebruiker gevraagd wordt of hij/zij geabonneerd wil worden op de nieuwsbrief (nogmaals: :r ).
Het uitvoeren van javascriptcode op het moment dat de gebruiker wegnavigeert is niet zo lastig, maar is het ook mogelijk te voorkomen dat de unload van de pagina daadwerkelijk plaats vind?
Ik denk dat het niet te voorkomen is, dus zou je een nieuw venster (popup ofzo) moeten openen. En dan vraag ik me ook nog af of het wel mogelijk is om te achterhalen of iemand naar een andere pagina binnen de site gaat of naar een andere site (of het venster gewoon sluit).

Afgezien daarvan moet je het imho ook helemaal niet willen. Als een bezoeker van een site wegnavigeert en je probeert hem dan op de site te houden, zal zo'n gebruiker dat niet echt kunnen waarderen. Dat wordt nog minder als je dat bij iedere keer dat de bezoeker de site bezoekt weer gaat vragen. En iemand die de nieuwsbrief al ontvangt, moet je er helemaal niet mee lastigvallen. Bijkomend punt is dat je niet weet of iemand wel of niet geabonneerd is op de nieuwsbrief.

Beste reden om het niet te bouwen is dat het niet kan.
fokstok.nl
pi_88361248
quote:
1s.gif Op vrijdag 5 november 2010 13:00 schreef Light het volgende:

[..]
Afgezien daarvan moet je het imho ook helemaal niet willen. Als een bezoeker van een site wegnavigeert en je probeert hem dan op de site te houden, zal zo'n gebruiker dat niet echt kunnen waarderen. Dat wordt nog minder als je dat bij iedere keer dat de bezoeker de site bezoekt weer gaat vragen. En iemand die de nieuwsbrief al ontvangt, moet je er helemaal niet mee lastigvallen. Bijkomend punt is dat je niet weet of iemand wel of niet geabonneerd is op de nieuwsbrief.

Beste reden om het niet te bouwen is dat het niet kan.
Helemaal mee eens, maar als je klant het blijft willen, dan kun je ethische argumenten aandragen wat je wilt, uiteindelijk moet je het helaas gewoon doen. Klant komt er zelf ook wel een keer achter dat de bezoekersaantallen kelderen, ik ga gewoon als een dom schaap die functie proberen te bouwen nu.
pi_88361345
quote:
1s.gif Op vrijdag 5 november 2010 13:04 schreef Intrepidity het volgende:

[..]

Helemaal mee eens, maar als je klant het blijft willen, dan kun je ethische argumenten aandragen wat je wilt, uiteindelijk moet je het helaas gewoon doen. Klant komt er zelf ook wel een keer achter dat de bezoekersaantallen kelderen, ik ga gewoon als een dom schaap die functie proberen te bouwen nu.
Succes :) Kijk ook nog even bij het linkje in m'n vorige post, daar staat dat het niet mogelijk is te achterhalen waar iemand naartoe navigeert als onunload wordt aangeroepen. :)
fokstok.nl
pi_88403060
Ik zoek een debugger die code klaarmaakt voor iedere browser, gericht op Javascript, hebben jullie namen? O+
actieve topics nieuwe topics
abonnement Unibet Coolblue Bitvavo
[Javascript] voor dummies (deel 10)
Index

» digital corner

» development

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