login  Naam:   Wachtwoord: 
Registreer je!
 Forum

Toon div

Offline webstab - 18/01/2006 18:21
Avatar van webstabPHP ver gevorderde Ik ben bezig met een shoutbox te maken. Ik zou graag onderaan een knop met "Reageer" en wanneer er daar op gedrukt wordt, zou het formulier getoond moeten worden. Na wat googlen kwam ik op dit script.
  1. <script language="javascript">
  2. <!--
  3. function showtab(pDivName) {
  4. var divArray = new Array("div1");
  5. for (i = 0 ; i < divArray.length ; i++){
  6. if (pDivName==divArray[i]){
  7. myDiv = document.getElementById( divArray[i]) ;
  8. myDiv.style.display = 'block'
  9. }else{
  10. myDiv = document.getElementById( divArray[i] ) ;
  11. myDiv.style.display = 'none';
  12. }
  13. }
  14. }
  15. //-->
  16. </script>
  17. ...
  18. <input type="button" onclick="showtab('div1');" value="Reageer">
  19. <div id="div1" style="display: none;">hier staat het form</div>

Nu heb ik al vanalles geprobeerd, maar ik zou graag wanneer op "Reageer" gedrukt wordt dat deze knop ook verandert in "Verberg". [En dat het dan ook verdwijnt wanneer je er nog eens op duwt]

Aub: Antwoord niet met google of zoeken, want dat heb ik al gedaan, maar ik vind nergens een script dat hier aan voldoet en nadat ik wat bewerkt had, werkte dat script helemaal niet meer.

6 antwoorden

Gesponsorde links
Offline Dolfje - 18/01/2006 18:25 (laatste wijziging 18/01/2006 18:26)
Avatar van Dolfje Gouden medailleGouden medailleGouden medaille

PHP ver gevorderde
  1. <script language="javascript">
  2. <!--
  3. function showtab(pDivName) {
  4. var divArray = new Array("div1","div2");
  5. for (i = 0 ; i < divArray.length ; i++){
  6. if (pDivName==divArray[i]){
  7. myDiv = document.getElementById( divArray[i]) ;
  8. myDiv.style.display = 'block'
  9. }else{
  10. myDiv = document.getElementById( divArray[i] ) ;
  11. myDiv.style.display = 'none';
  12. }
  13. }
  14. }
  15. //-->
  16. </script>
  17. ...
  18. <div id="div2" style="display: none;">
  19. <input type="button" onclick="showtab('div1');" value="Reageer">
  20. </div>
  21. <div id="div1" style="display: none;">
  22. <input type="button" onclick="showtab('div2');" value="Verberg">
  23. hier staat het form</div>


(dit is geen geadvanceerde javascript)
Offline webstab - 18/01/2006 18:32 (laatste wijziging 18/01/2006 18:49)
Avatar van webstab PHP ver gevorderde Bij het duwen op reageer komt het formulier en de verbergknop, maar verdwijnt de reageer knop niet.

Ik zit ongeveer wat het script doet, maar ik kan dat niet wijzigen. [javscript is voor mij gelijk aan chinees]

  1. <div id="div2" style="display: none;">
  2. <input type="button" onclick="showtab('div1');" value="Reageer">
  3. </div> heb ik veranderd naar
  4. <div id="div2" style="display: ;">
  5. <input type="button" onclick="showtab('div1');" value="Reageer">
  6. </div>
maar de reageerknop verdwijnt niet, wel als ik Verberg duw.
Offline Thomas - 18/01/2006 19:21 (laatste wijziging 18/01/2006 19:25)
Avatar van Thomas Moderator Misschien moet je ook de visibility op hidden zetten?

  1. function showtab(pDivName) {
  2. var divArray = new Array("div1");
  3. for(i = 0 ; i < divArray.length ; i++) {
  4. var myDiv = document.getElementById(divArray[i]);
  5. if(pDivName == divArray[i]) {
  6. myDiv.style.display = "block";
  7. myDiv.style.visibility = "visible";
  8. } else {
  9. myDiv.style.display = "none";
  10. myDiv.style.visibility = "hidden";
  11. }
  12. }
  13. }
Offline anton - 15/01/2009 20:17
Avatar van anton Lid wat doet die display block? ik heb namelijk iets soortgelijk maar tog anders , ik wil dus als iemand op de link klikt de div tonen en weer verbergen als hij weer klikt dat is allemaal gelukt en werkt ook(heb ik met visibility gedaan) maar wanneer de div dus verborgen is dan blijft de plek waar die div stond open met niets erin...nu wil ik dat de links gewoon per regel 1 staan en onclick tonen en onclick terug zoals in het begin...

  1. function checkMenu(menuID){
  2. if(document.getElementById(menuID).style.visibility == "hidden"){
  3. dropMenu(menuID);
  4. }
  5. else{
  6. unDropMenu(menuID);
  7. }
  8. }
  9.  
  10. function dropMenu(menuID){
  11. document.getElementById(menuID).style.visibility="visible";
  12. }
  13.  
  14. function unDropMenu(menuID){
  15. document.getElementById(menuID).style.visibility="hidden";
  16. }
Offline anton - 15/01/2009 20:17 (laatste wijziging 15/01/2009 20:18)
Avatar van anton Lid wat doet die display block? ik heb namelijk iets soortgelijk maar tog anders , ik wil dus als iemand op de link klikt de div tonen en weer verbergen als hij weer klikt dat is allemaal gelukt en werkt ook(heb ik met visibility gedaan) maar wanneer de div dus verborgen is dan blijft de plek waar die div stond open met niets erin...nu wil ik dat de links gewoon per regel 1 staan en onclick tonen en onclick terug zoals in het begin...

  1. function checkMenu(menuID){
  2. if(document.getElementById(menuID).style.visibility == "hidden"){
  3. dropMenu(menuID);
  4. }
  5. else{
  6. unDropMenu(menuID);
  7. }
  8. }
  9.  
  10. function dropMenu(menuID){
  11. document.getElementById(menuID).style.visibility="visible";
  12. }
  13.  
  14. function unDropMenu(menuID){
  15. document.getElementById(menuID).style.visibility="hidden";
  16. }

  1. <font color="#00CC66">&bull;</font><a href="javascript: checkMenu('een')">Wie behoort er tot de Crew en wie niet?</a><br><div align="right" id="een" style="visibility:hidden">blablablablabla</div><br />

ps sorry dat ik niet heel mn script post maar 723 regels neemt wat teveel plaats in...als jullie andere delen ervan nodig hebben zeggen jullie het maar...
Offline Maarten - 16/01/2009 00:27
Avatar van Maarten Erelid Het feit dat de zogezegd gereserveerde plaats zichtbaar blijft zit hem in het doel van visibility.
display: none verbergt je element, en ook de plaats die het zou moeten innemen.
visibility: hidden verbeft je element en laat die plaats voor wat het is.

Wil je van die open ruimte af, herbouw het dan terug naar display, zoals je het eerst had. Je code nu is goed, verander gewoon style.visibility = 'hidden' in style.display = 'none', en visible in block (of inline, naargelang je wensen - meer info).
Gesponsorde links
Dit onderwerp is gesloten.
Actieve forumberichten
© 2002-2024 Sitemasters.be - Regels - Laadtijd: 0.234s