[Javascript] voor dummies (deel 9)

Index

» digital corner

» development

actieve topics nieuwe topics
abonnement Unibet Coolblue Bitvavo
  donderdag 30 juli 2009 @ 13:12:25 #101
85919 Likkende_Lassie
Doe eens wat aan je ondertitel
pi_71456336
quote:
Op donderdag 30 juli 2009 13:09 schreef Chandler het volgende:

[..]

wat liev
pi_71461194
Maar nog steeds weet ik niet hoe ik die selector verander ik doe ws iet goed fout
The people who lost my respect will never get a capital letter for their name again.
Like trump...
pi_71461232
Wat is de waarde van die string, klopt die wel?
pi_71472601
dit is het stukje code dat vooraf gaat ;)

1
2
3
4
5
6
7
8
9		    function changeFont(position)
    {
        if (position != '')
        {
            textPosition = position;
        }


        o = '<span id="inputpreview" style="text-align:' + textPosition + '; display:block; width: 250px;">' + document.getElementById('inputtext').value + '</span>'


en zo wordt het aangeroepen

1
2
3		        <input type="button" value="< Links" onclick="changeFont('left');" />  
        <input type="button" value="> Midden <" onclick="changeFont('center');" />  
        <input type="button" value="Rechts >" onclick="changeFont('right');" /><br />


Dus je zou zeggen dat het zo goed moet zijn.
The people who lost my respect will never get a capital letter for their name again.
Like trump...
  zaterdag 1 augustus 2009 @ 14:18:25 #105
85919 Likkende_Lassie
Doe eens wat aan je ondertitel
pi_71514581
Het is mij nog niet geheel duidelijk of je een FORM POST kan versturen naar een POPUP, dus dat je de POST in de popup ontvangt en hem daar afhandelt?
pi_71514667
quote:
Op zaterdag 1 augustus 2009 14:18 schreef Likkende_Lassie het volgende:
Het is mij nog niet geheel duidelijk of je een FORM POST kan versturen naar een POPUP, dus dat je de POST in de popup ontvangt en hem daar afhandelt?
1<form action="pagina.php" method="post" target=" ... ">
  zaterdag 1 augustus 2009 @ 14:38:17 #107
85919 Likkende_Lassie
Doe eens wat aan je ondertitel
pi_71514965
Thanks is me idd gelukt.
  dinsdag 4 augustus 2009 @ 10:50:15 #108
85919 Likkende_Lassie
Doe eens wat aan je ondertitel
pi_71587694
is het mogelijk om te zien op welk element je staat met je muis?
pi_71607045
heeft iemand enig idee hoe je die "popupjes" van plaatjes maakt die je tegenwoordig veel ziet op websites?,. bv hier op de site van tweakers als je op het plaatje drukt dat ie vergroot wordt weergegeven en dat het lijkt alsof ie de rest van de site disabled.
alvast bedankt
pi_71610415
Dat heet een lightbox.
fokstok.nl
pi_71621369
Mijn vorige probleem is opgelost, alleen nu komt de volgende.

1
2
3
4
5
6		        var codes = { selector: 'span',
                      css:      ['.sIFR-root { text-align: ' + textPosition + ',
                                               font-size: ' + textSize + '
                                             }
                                 ']
                    }


nu krijg ik een error dat een tekenreeks niet afgesloten is op regel 49 = 2e regel, dit heeft volgens mij te maken met textPosition maar helaas kan ik niet vinden waar de fout zit ziet iemand de fout?
The people who lost my respect will never get a capital letter for their name again.
Like trump...
pi_71621736
Haal alle newlines er eens uit en zet alles op één regel.
pi_71624568
Helemaal!
The people who lost my respect will never get a capital letter for their name again.
Like trump...
pi_71625448
javascript 101, zou jij toch wel moeten kennen
pi_71634055
quote:
Op dinsdag 4 augustus 2009 23:13 schreef Light het volgende:
Dat heet een lightbox.
thanks
pi_71641980
quote:
Op woensdag 5 augustus 2009 15:49 schreef Darkomen het volgende:
javascript 101, zou jij toch wel moeten kennen
Nee, url?
The people who lost my respect will never get a capital letter for their name again.
Like trump...
pi_71943591
Hoe kan ik met Javascript een 'tab' verrichten? Ik wil als het ware dat wanneer ik op mijn eerste textbox van mijn formulier de focus heb liggen, een 'tab' doen zodat de focus naar de volgende control (deze is dus niet altijd hetzelfde) op mijn formulier gaat.
  maandag 17 augustus 2009 @ 12:10:35 #118
85919 Likkende_Lassie
Doe eens wat aan je ondertitel
pi_71945831
Kan je met de tabindex doen
pi_71946772
quote:
Op maandag 17 augustus 2009 12:10 schreef Likkende_Lassie het volgende:
Kan je met de tabindex doen
Met tabindex stel je puur de volgorde in, als die al moet afwijken van de 'flow'. In mijn geval moet ik automatisch (dus wanneer bijvoorbeeld een event plaats vindt op een input) de focus kunnen instellen op de volgende input (wat of waar die ook mag zijn), dus als het ware een tab nabootsen.

Het is geen eenvoudige kwestie van puur de focus() d.m.v. getElementById() op een element gaan leggen, want het ID van het volgende element heb ik nooit daar die variabel is.

[ Bericht 2% gewijzigd door Tuvai.net op 17-08-2009 12:48:26 ]
pi_71947311
Ah, ik denk dat ik de oplossing heb. Ik zie dat ik gebruik kan maken van [Element].form en dat elke index van form een input voorstelt. Nog even testen of ik een werkend scriptje kan maken en dat kan gebruiken in alle browsers die ik geïnstalleerd heb.
pi_71947545
quote:
Op maandag 17 augustus 2009 12:59 schreef Tuvai.net het volgende:
Ah, ik denk dat ik de oplossing heb. Ik zie dat ik gebruik kan maken van [Element].form en dat elke index van form een input voorstelt. Nog even testen of ik een werkend scriptje kan maken en dat kan gebruiken in alle browsers die ik geïnstalleerd heb.
Op deze pagina staat ook iets werkends. Misschien heb je daar nog wat aan.
fokstok.nl
pi_71948504
quote:
Op maandag 17 augustus 2009 13:07 schreef Light het volgende:

[..]

Op deze pagina staat ook iets werkends. Misschien heb je daar nog wat aan.
Had ik al naar gekeken. Met custom tabindex werken is voor mij geen optie. :) Die volgorde of het aantal controls is altijd variabel. :)

Maar ik heb nu een werkende oplossing. Net getest in IE6, 7 en 8, Mozilla, Opera, Safari en Chrome. :)

Ik heb eerst een functie die aan de hand van een element controleert welke index deze in een formulier heeft:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17		function GetElementIndex(Element)
{
    var index = -1, i = 0;
   
    while ( i < Element.form.length && index == -1 )
    {
      if (Element.form[i] == Element)
      {
         index = i;
      }
      else
      {
         i++;
      }
   }
    return index;
}


Vervolgens roep ik deze functie aan, die bij diverse events kan plaats vinden en de focus op het volgende element legt (als deze er is; als het betreffende element het laatste element is, komt de focus gewoon op dat element te liggen):

1
2
3
4
5
6
7
8
9
10
11
12
13		function ContinueFocus(Element)
{
   if( GetElementIndex(Element) < (Element.form.length - 1) )
   {
      Element.form[ ( GetElementIndex(Element) + 1) ].focus();
   }
   else
   {
      Element.focus();
   }
   
   return true;
}
pi_71951345
Nou, mijn focus probleem is nog maar net opgelost en ik heb alweer een nieuwtje.

Ik heb in HTML een list:
1
2
3
4
5
6		<ul>
<li><a href="#">een</a></li>
<li><a href="#">twee</a></li>
<li><a href="#">drie</a></li>
<li><a href="#">vier</a></li>
</ul>


Nou wil ik dat wanneer de focus() bijvoorbeeld op het derde item ligt, en je op het pijltje naar boven drukt op je toetsenbord, de focus() naar het tweede item gaat. Ik heb hiervoor mijn list als volgt uitgebreid:

1
2
3
4
5
6		<ul>
<li><a href="#" id="Anchor1" onkeydown="PressedKeyAnchor(1, event);">een</a></li>
<li><a href="#" id="Anchor2" onkeydown="PressedKeyAnchor(2, event);">twee</a></li>
<li><a href="#" id="Anchor3" onkeydown="PressedKeyAnchor(3, event);">drie</a></li>
<li><a href="#" id="Anchor4" onkeydown="PressedKeyAnchor(4, event);">vier</a></li>
</ul>


De PressedKeyAnchor() functie:
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		function PressedKeyAnchor(AnchorIndex, Event)
{
   var KeyNumber = Event.keyCode != null ? Event.keyCode : Event.which;
   
   switch(KeyNumber)
   {
      case 13: // Enter
         alert('U heeft gekozen voor linkje nummer ' + AnchorIndex);
         break;
      case 38: // Up
         if(document.getElementById('Anchor' + ( AnchorIndex - 1 )))
         {
            document.getElementById('Anchor' + ( AnchorIndex - 1 )).focus();
         }
         break;
      case 40: // Down
         if(document.getElementById('Anchor' + ( AnchorIndex + 1 )))
         {
            document.getElementById('Anchor' + ( AnchorIndex + 1 )).focus();
         }
         break;
   }
   
   return;
}


Resultaten:

Mozilla: perfect
Internet Explorer 6, 7 én 8: perfect
Safari: Doet helemaal NIKS
Opera: Doet het heel willekeurig wél en dan weer niet. Ik merk dat wanneer ik eerst op enter of spatie druk, en dan op één van de anchors in het lijstje klik, ik vervolgens met de pijltjes naar boven en naar onder kan focussen. Refresh ik de pagina, probeer ik het vervolgens opnieuw (zonder eerst enter of spatie te gebruiken) dan doet 'ie het weer niet.

Iemand een idee/verklaring voor dit gedrag?

EDIT: Opera werkt ook goed. Bleek dat ik ergens een <span> niet goed had afgesloten. Nu ik dat verholpen heb doet het script in Opera het ook goed.

Alleen Safari doet nog vervelend dus. Of ja, helemaal niks. Wat me opvalt is dat, wanneer ik de anchors middels CSS een andere background-color meegeef wanneer :focus / :active van toepassing is, wanneer ik op één van de anchors klik in Safari ik heel snel even de andere background-color zie en deze daarna meteen verdwijnt. Alsof ik niet mag focussen op de anchors in Safari.

[ Bericht 11% gewijzigd door Tuvai.net op 17-08-2009 15:36:39 ]
pi_71951526
Ik ben opzoek naar een script zoals lightbox maar dan om te gebruiken in de layout van de site zelf.

Dus niet een div popup maar gewoon als ik klik op een afbeelding dat er dan de volgende komt en eventueel de vorige (zoals een slideshow in lightbox)

Anyone?
The people who lost my respect will never get a capital letter for their name again.
Like trump...
pi_72110234
De bedoeling is dat ik met php mijn database uitlees. Dit geef ik vervolgens mee aan javascript in een (multi)array. Javascript moet dan elke X seconden van een random array (het is een multiarray) de waardes uitlezen en weergeven. Alle waardes moeten echter even vaak voorkomen. Hierdoor lijkt het mij noodzakelijk om de arrays met waardes die al geweest zijn uit het grote array te halen nadat ze zijn weergegeven en toe te voegen aan een nieuw multiarray. Nadat het oorspronkelijke multiarray leeg is wordt dan gewoon dezelfde functie opnieuw aangeroepen, maar dan met het nieuwe array als input.

Het probleem is nu echter dat ik nog maar weinig kaas heb gegeten van javascript. Gezien de tijd waarin ik dit stuk af moet hebben gaat me dat helaas ook niet meer lukken.

Met wat gescharrel over het internet ben ik tot het volgende gekomen:

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 type="text/javascript">
<!--
var sponsors = new Array();
<?php
$query = "SELECT logo, naam, url, tel FROM sponsors WHERE dm=1";
$result = mysql_query($query);
if($result)
{
    $count = 0;
    while ($result_level1 = mysql_fetch_array($result))
    {
        $count++;
        echo 'sponsors[' . $count . '] = "' . $result_level1['nodeId'] . '|' . $result_level1['parentNodeId'] . '|' . $result_level1['nodeName'] . '|' . $result_level1['nodeUrl'] . '";';
                echo "\n";
    }
}
else
{
    echo 'Error';
}
?>

displaySponsors(sponsors);

function displaySponsors(ar){

  var ranNum= Math.floor(Math.random()*ar.length);

}
//-->
</script>


Alleen nu moet ik time-based dingen gaan invoegen en weet ik echt niet meer waar ik het moet zoeken.
ウプピエ 八十三 &lt;&lt; u-pu-pi-e hachi-ju-san, ik denk ik zeg het er maar ff bij :P
actieve topics nieuwe topics
abonnement Unibet Coolblue Bitvavo
[Javascript] voor dummies (deel 9)
Index

» digital corner

» development

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