login  Naam:   Wachtwoord: 
Registreer je!
 Forum

td Colspan werkt niet wanneer de tr standaard verborgen is

Offline pim1991 - 05/07/2010 15:41
Avatar van pim1991PHP interesse Hallo,

Zit met een probleem.

Ik verberg standaard een <tr> met <tr style=\"display:none\" id=\"test\">.
Daarna staat er <td colspan=\"6\"> maar de colspan wordt dus niet gepakt wanneer de display:none naar display:block gaat (via javascript dus).
Met als gevolg dat je de hele tabel uit elkaar rukt (wordt breder).

Iemand die een oplossing weet?

Alvast bedankt!

14 antwoorden

Gesponsorde links
Offline WouterPSV - 05/07/2010 15:52
Avatar van WouterPSV Lid probeer het is een css pagina erbij
Offline pim1991 - 05/07/2010 17:32
Avatar van pim1991 PHP interesse Hoe bedoel je dat? Waarom zou ik display:none in een CSS willen zetten?
Offline ArieMedia - 05/07/2010 17:36
Avatar van ArieMedia Gouden medaille

PHP ver gevorderde		 in een TR zet ik nooit style-tags, maar altijd in de TD..

Scheelt me een hoop van deze problemen..

Wat je dus kan proberen is display block in je td zetten ipv tr
Offline pim1991 - 05/07/2010 18:03
Avatar van pim1991 PHP interesse Dat had ik dus ook geprobeerd ... Helaas zonder effect, toen deed de javascript niet meer zijn werk (de TD verdween niet) 
Offline WouterJ - 05/07/2010 19:04
Avatar van WouterJ HTML gevorderde Misschien javascript aanpassen?
En mogen we misschien iets meer info, zoals code/online voorbeeld? 
Offline pim1991 - 05/07/2010 20:14
Avatar van pim1991 PHP interesse
php code - Bekijk de code zonder highlighting - Klap code in 
  1. <script type="text/JavaScript1.2">
  2. function ShowHide(div,label)
  3. {
  4.         var thisLevel = document.getElementById(div);
  5.         var thisLabel = document.getElementById(label);
  6.  
  7.         if (thisLevel.style.display == "none")
  8.         {
  9.                 thisLevel.style.display = "block";
  10.                 thisLabel.innerText = "-";
  11.         }
  12.         else
  13.         {
  14.                 var thisLevel = document.getElementById(div);
  15.                 thisLevel.style.display = "none";
  16.                 thisLabel.innerText = "+";
  17.         }
  18. }
  19. </script>


Javascript gedeelte ;)
Offline Jelmerholland - 05/07/2010 20:29 (laatste wijziging 05/07/2010 20:30)
Avatar van Jelmerholland PHP beginner Waarom gebruik je geen jquery? dat maakt je leven zoveel makkelijker 
En dan doel ik op de show() en hide() functie...
Offline pim1991 - 05/07/2010 20:58
Avatar van pim1991 PHP interesse Omdat dit het enige stukje javascript is wat er te bespeuren is op de hele website ;)
Offline WouterJ - 05/07/2010 23:03
Avatar van WouterJ HTML gevorderde jQuery kan ook met maar 1 js script. Het is stukken makkelijker en ziet er mooier uit.
Offline Jelmerholland - 06/07/2010 00:10 (laatste wijziging 06/07/2010 00:10)
Avatar van Jelmerholland PHP beginner Je kan ook een lib downloaden [naam! iemand?] voor jquery voor easeInOut en dat soort dingen. Zie mijn navigatie, die is volledig met jquery gemaakt.

http://www.jdwebdesign.nl
Offline Martijn - 06/07/2010 01:57 (laatste wijziging 06/07/2010 01:58)
Avatar van Martijn Crew PHP die javascript code is echt niets bijzonders hoor Waldio, dat is echt niets. jQuery hiervoor gebruiken is als een V8 in een klein autootje hangen, de V8 is leuk, maar t moet wel bij t doel passen ;)

Het probleem zit m inderdaad in de display:none; maar misschien kun je het op een andere manier proberen, zoals de heigth van die tr op 0px zetten, en na je actie op de juiste hoogte. Of mogelijk iets met kleur ofzo
Offline Jelmerholland - 06/07/2010 12:26
Avatar van Jelmerholland PHP beginner Ik zou nou gewoon meteen op jquery overgaan. Spijt me zeer, maar het blijft vast niet alleen bij deze javascript en jquery maakt je werkt stukken lichter ben begrijpelijker. Het is gewoon veel makkelijker. Je kan dezelfde input als CSS gebruiken dus show('#div') bijvoorbeeld, is echt ideaal
Offline Martijn - 06/07/2010 12:45
Avatar van Martijn Crew PHP Maar het gaat ten koste van je laadtijd. Als dit alles is wat ie wilt hebben, werkt wat ie nu heeft toch ook? Je gaat toch niet een heel framework aanknopen voor 1 functie..
Offline ProjectWebdesign - 06/07/2010 17:28 (laatste wijziging 06/07/2010 17:29)
Avatar van ProjectWebdesign Lid Het probleem ligt hem aan de display: block;.
Een tabel rij kan je geen display: block; geven, ofja het kan wel maar hij gaat zich dan anders gedragen.
Je moet dan ook de display: table-row; gebruiken, dan werkt het wel als het goed is.

Probeer deze javascript eens:

javascript code - Bekijk de code zonder highlighting - Klap code in 
  1. <script type="text/JavaScript1.2">
  2. function ShowHide(div,label)
  3. {
  4.         var thisLevel = document.getElementById(div);
  5.         var thisLabel = document.getElementById(label);
  6.  
  7.         if (thisLevel.style.display == "none")
  8.         {
  9.                 thisLevel.style.display = "table-row";
  10.                 thisLabel.innerText = "-";
  11.         }
  12.         else
  13.         {
  14.                 var thisLevel = document.getElementById(div);
  15.                 thisLevel.style.display = "none";
  16.                 thisLabel.innerText = "+";
  17.         }
  18. }
  19. </script>


PS: Als je jQuery gebruikt zit je met hetzelfde probleem, want die maakt er display: block; van. Je kan evt. fadeIn()/fadeOut() gebruiken en zelf daarna de display aanpassen.
Gesponsorde links
Dit onderwerp is gesloten.
Actieve forumberichten
© 2002-2024 Sitemasters.be - Regels - Laadtijd: 0.181s