Anzeige

Spry Registerkarte auf "komplizierte" Tabelle anwenden

Spry Registerkarte auf "komplizierte" Tabelle anwenden | PSD-Tutorials.de

Erstellt von metallica1990, 24.08.2008.

  1. metallica1990

    metallica1990 Nicht mehr ganz neu hier

    Dabei seit:
    20.08.2007
    Beiträge:
    119
    Geschlecht:
    männlich
    Spry Registerkarte auf "komplizierte" Tabelle anwenden
    Ich will meine Menüs ein- und ausklappen können.
    Habe schon alles mögliche ausprobiert aber ich bekomme es nicht hin.
    Hier ein Beispiel eines Klappmenüs, dass Dreamweaver erstellt hat:
    HTML:
    1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    2. <html xmlns="http://www.w3.org/1999/xhtml">
    3. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    4. <title>Unbenanntes Dokument</title>
    5. <script src="SpryAssets/SpryCollapsiblePanel.js" type="text/javascript"></script>
    6. <link href="SpryAssets/SpryCollapsiblePanel.css" rel="stylesheet" type="text/css" />
    7. </head>
    8.  
    9. <div id="CollapsiblePanel1" class="CollapsiblePanel">
    10.   <div class="CollapsiblePanelTab" tabindex="0">Registerkarte</div>
    11.   <div class="CollapsiblePanelContent">Inhalt</div>
    12. </div>
    13. <script type="text/javascript">
    14. <!--
    15. var CollapsiblePanel1 = new Spry.Widget.CollapsiblePanel("CollapsiblePanel1");
    16. //-->
    17. </body>
    18. </html>
    19.  
    Wenn man also auf "Registerkarte" klickt klappt das Menü ein und aus.

    Das gleiche soll nun in dieser Tabelle geschehen
    Dabei soll das Bild "leftcolumnheader_up.gif als Button Funktinieren, mit dem man das menü ein - und ausklappen kann
    der Bereich der Tabelle , der ein- und ausgeklappt werden soll ist dieser:
    HTML:
    1.  
    2. <tr>
    3.                       <td height="15" bgcolor="#5C5E4F"><a href="<?php echo $homepage_domain;?>index.php">News</a>&nbsp;/&nbsp;<a href="<?php echo $homepage_domain;?>newsarchiv/index.php">Newsarchiv</a></td>
    4.                     </tr>
    5.                     <tr>
    6.                       <td class="dotborder" height="1"></td>
    7.                     </tr> <tr>
    8.                      <td height="15" bgcolor="#5C5E4F"><a href="<?php echo $homepage_domain;?>kontakt/index.php">Kontakt</a>&nbsp;/&nbsp;<a href="<?php echo $homepage_domain;?>uebermich/index.php">About</a></td>
    9.                     </tr>
    10.                     <tr>
    11.                       <td class="dotborder" height="1"></td>
    12.                     </tr>
    13.                     <tr>
    14.                       <td height="15" bgcolor="#5C5E4F"><a href="<?php echo $homepage_domain;?>links/index.php">Links</a>&nbsp;/&nbsp;<a href="<?php echo $homepage_domain;?>linkus/index.php">Verlinke mich!</a></td>
    15.                     </tr>
    16.                     <tr>
    17.                       <td class="dotborder" height="1"></td>
    18.                     </tr>
    19.                     <tr>
    20.                       <td height="15" bgcolor="#5C5E4F"><a href="<?php echo $homepage_domain;?>musik/index.php">Musik</a>&nbsp;/&nbsp;<a href="<?php echo $homepage_domain;?>meinelieblingsmusik/index.php">Lieblingsbands</a></td>
    21.                   </tr>
    22.                     <tr>
    23.                       <td class="dotborder" height="1"></td>
    24.                     </tr>
    25.                     <tr>
    26.                       <td height="15" bgcolor="#5C5E4F"><a href="<?php echo $homepage_domain;?>hardware/index.php">Hardware</a>&nbsp;/&nbsp;<a href="<?php echo $homepage_domain;?>software/index.php">Software</a></td>
    27.                     </tr>
    28.                     <tr>
    29.                       <td class="dotborder" height="1"></td>
    30.                     </tr>
    31.                     <tr>
    32.                       <td height="15" bgcolor="#5C5E4F"><a href="<?php echo $homepage_domain;?>informatik/index.php">Informatik</a>&nbsp;/&nbsp;<a href="<?php echo $homepage_domain;?>esportframe/index.php">Esports</a></td>
    33.                     </tr>
    34.                         <tr>
    35.                       <td class="dotborder" height="1"></td>
    36.                     </tr>
    37.                     <tr>
    38.                       <td height="15" bgcolor="#5C5E4F"><a href="<?php echo $homepage_domain;?>tippstricks/index.php">Tipps/Tricks</a>&nbsp;/&nbsp;<a href="<?php echo $homepage_domain;?>archiv/index.php">Archiv</a></td>
    39.                     </tr>
    40.  
    Hier die gesamte Tabelle
    HTML:
    1. <table border="0" align="center" cellpadding="0" cellspacing="5">
    2.         <tr>
    3.           <td valign="top"><table border="0" cellspacing="0" cellpadding="0">
    4.               <tr>
    5.                 <td><table width="157" border="0" cellpadding="0" cellspacing="0">
    6.                     <tr>
    7.                       <td><img src="<?php echo $homepage_domain;?>images/leftcolumnheader_up.gif" width="49" height="36" alt="leftcolumnheader_up.gif"></td>
    8.                       <td width="92" height="36" valign="top" class="centercolumnheader"><table width="100%" border="0" cellspacing="0" cellpadding="0">
    9.                           <tr>
    10.                             <td height="9"></td>
    11.                           </tr>
    12.                           <tr>
    13.                             <td><font color="#B5B5B5" size="1" face="Verdana, Arial, Helvetica, sans-serif">Navigation</font></td>
    14.                           </tr>
    15.                       </table></td>
    16.                       <td><img src="<?php echo $homepage_domain;?>images/rightcolumnheader.gif" width="16" height="36" alt="rightcolumnheader.gif"></td>
    17.                     </tr>
    18.                   </table></td>
    19.               </tr>
    20.               <tr>
    21.                 <td>          
    22.                     <table width="100%" border="0" cellspacing="0" cellpadding="0" class="sideborders">
    23.                     <tr>
    24.                       <td height="15" bgcolor="#5C5E4F"><a href="<?php echo $homepage_domain;?>index.php">News</a>&nbsp;/&nbsp;<a href="<?php echo $homepage_domain;?>newsarchiv/index.php">Newsarchiv</a></td>
    25.                     </tr>
    26.                     <tr>
    27.                       <td class="dotborder" height="1"></td>
    28.                     </tr> <tr>
    29.                      <td height="15" bgcolor="#5C5E4F"><a href="<?php echo $homepage_domain;?>kontakt/index.php">Kontakt</a>&nbsp;/&nbsp;<a href="<?php echo $homepage_domain;?>uebermich/index.php">About</a></td>
    30.                     </tr>
    31.                     <tr>
    32.                       <td class="dotborder" height="1"></td>
    33.                     </tr>
    34.                     <tr>
    35.                       <td height="15" bgcolor="#5C5E4F"><a href="<?php echo $homepage_domain;?>links/index.php">Links</a>&nbsp;/&nbsp;<a href="<?php echo $homepage_domain;?>linkus/index.php">Verlinke mich!</a></td>
    36.                     </tr>
    37.                     <tr>
    38.                       <td class="dotborder" height="1"></td>
    39.                     </tr>
    40.                     <tr>
    41.                       <td height="15" bgcolor="#5C5E4F"><a href="<?php echo $homepage_domain;?>musik/index.php">Musik</a>&nbsp;/&nbsp;<a href="<?php echo $homepage_domain;?>meinelieblingsmusik/index.php">Lieblingsbands</a></td>
    42.                   </tr>
    43.                     <tr>
    44.                       <td class="dotborder" height="1"></td>
    45.                     </tr>
    46.                     <tr>
    47.                       <td height="15" bgcolor="#5C5E4F"><a href="<?php echo $homepage_domain;?>hardware/index.php">Hardware</a>&nbsp;/&nbsp;<a href="<?php echo $homepage_domain;?>software/index.php">Software</a></td>
    48.                     </tr>
    49.                     <tr>
    50.                       <td class="dotborder" height="1"></td>
    51.                     </tr>
    52.                     <tr>
    53.                       <td height="15" bgcolor="#5C5E4F"><a href="<?php echo $homepage_domain;?>informatik/index.php">Informatik</a>&nbsp;/&nbsp;<a href="<?php echo $homepage_domain;?>esportframe/index.php">Esports</a></td>
    54.                     </tr>
    55.                         <tr>
    56.                       <td class="dotborder" height="1"></td>
    57.                     </tr>
    58.                     <tr>
    59.                       <td height="15" bgcolor="#5C5E4F"><a href="<?php echo $homepage_domain;?>tippstricks/index.php">Tipps/Tricks</a>&nbsp;/&nbsp;<a href="<?php echo $homepage_domain;?>archiv/index.php">Archiv</a></td>
    60.                     </tr>
    61.                     <tr>
    62.                       <td class="dotborder" height="1"></td>
    63.                     </tr>
    64.                     <tr>
    65.                       <td class="dotborder" height="1"></td>
    66.                     </tr>
    67.                     <tr>
    68.                       <td class="dotborder" height="1"></td>
    69.                     </tr>
    70.                   </table>
    71.                   </td>
    72.               </tr>
    73.               <tr>
    74.                 <td><img src="<?php echo $homepage_domain;?>images/bottomcolumns.gif" width="157" height="9" alt="bottomcolumns.gif"></td>
    75.               </tr>
    76.             </table></td>
    77.         </tr>
    78.       </table>
    Bitte um hilfe ...
    ICQ: 491747628
     
    #1      
  2. sokie

    sokie Mod | Web

    Dabei seit:
    23.03.2008
    Beiträge:
    5.338
    Geschlecht:
    männlich
    Ort:
    Bünde NRW
    Software:
    <br>COREL <br> Texteditor
    Spry Registerkarte auf "komplizierte" Tabelle anwenden
    AW: Spry Registerkarte auf "komplizierte" Tabelle anwenden

    Da wirst du mit einer Tabelle nicht weiterkommen.
    nach dem Beispiel musst du drei Divs haben die entsprechend angeordnet sind mit entsprechenden Bezeichnern.
     
    #2      
  3. metallica1990

    metallica1990 Nicht mehr ganz neu hier

    Dabei seit:
    20.08.2007
    Beiträge:
    119
    Geschlecht:
    männlich
    Spry Registerkarte auf "komplizierte" Tabelle anwenden
    AW: Spry Registerkarte auf "komplizierte" Tabelle anwenden

    Aber könnte man die Tabelle nicht zerstückelt zwischen die divs packen?
     
    #3      
  4. GeneralFabi

    GeneralFabi Nicht mehr ganz neu hier

    Dabei seit:
    06.03.2007
    Beiträge:
    93
    Geschlecht:
    männlich
    Ort:
    Neunkirchen (Saar)
    Software:
    Adobe Creative Suite 5 Design Premium
    Kameratyp:
    Panasonic Lumix DMC-FZ5
    Spry Registerkarte auf "komplizierte" Tabelle anwenden
    AW: Spry Registerkarte auf "komplizierte" Tabelle anwenden

    Kannst du ja mal versuchen. Theoretisch gehts, aber in HTML ist die Praxis immer anders als die Theorie.
     
    #4      
  5. metallica1990

    metallica1990 Nicht mehr ganz neu hier

    Dabei seit:
    20.08.2007
    Beiträge:
    119
    Geschlecht:
    männlich
    Spry Registerkarte auf "komplizierte" Tabelle anwenden
    AW: Spry Registerkarte auf "komplizierte" Tabelle anwenden

    Ich hatte ja schonmal ein Klapptabelle Script darauf angewendet ... ging auch ... aber im Internet Explorer nicht, außerdem war dort die Darstellung sehr fehlerhaft
     
    #5      
  6. LowkaZ

    LowkaZ Half Life

    Dabei seit:
    19.01.2006
    Beiträge:
    697
    Geschlecht:
    männlich
    Ort:
    Dudweiler
    Software:
    Textmate, WordPress, jQuery, PHP5, MySQL, CSS3, HTML5
    Kameratyp:
    Leica
    Spry Registerkarte auf "komplizierte" Tabelle anwenden
    #6      
  7. metallica1990

    metallica1990 Nicht mehr ganz neu hier

    Dabei seit:
    20.08.2007
    Beiträge:
    119
    Geschlecht:
    männlich
    Spry Registerkarte auf "komplizierte" Tabelle anwenden
    AW: Spry Registerkarte auf "komplizierte" Tabelle anwenden

    mom ich such es eben ...
    Klapptabelle
    die hier
     
    #7      
  8. sokie

    sokie Mod | Web

    Dabei seit:
    23.03.2008
    Beiträge:
    5.338
    Geschlecht:
    männlich
    Ort:
    Bünde NRW
    Software:
    <br>COREL <br> Texteditor
    Spry Registerkarte auf "komplizierte" Tabelle anwenden
    AW: Spry Registerkarte auf "komplizierte" Tabelle anwenden

    "inhalt" kann auch eine Tabelle sein
     
    #8      
  9. metallica1990

    metallica1990 Nicht mehr ganz neu hier

    Dabei seit:
    20.08.2007
    Beiträge:
    119
    Geschlecht:
    männlich
    Spry Registerkarte auf "komplizierte" Tabelle anwenden
    AW: Spry Registerkarte auf "komplizierte" Tabelle anwenden

    Ja ... aber ein Menü (also mit Überschrift usw.) ist selbst eine tabelle ... ich weiss nicht , wie ich die aufteilen muss, um die darstellung beizubehalten und sie gleichzeitig klappen zu können ... sry für fehlende groß/kleinschreibung ... schon sehr spät ...
     
    #9      
  10. LowkaZ

    LowkaZ Half Life

    Dabei seit:
    19.01.2006
    Beiträge:
    697
    Geschlecht:
    männlich
    Ort:
    Dudweiler
    Software:
    Textmate, WordPress, jQuery, PHP5, MySQL, CSS3, HTML5
    Kameratyp:
    Leica
    Spry Registerkarte auf "komplizierte" Tabelle anwenden
    AW: Spry Registerkarte auf "komplizierte" Tabelle anwenden

    Benutz doch mein script, dann kannste einfach alles togglen was du willst.
     
    #10      
  11. metallica1990

    metallica1990 Nicht mehr ganz neu hier

    Dabei seit:
    20.08.2007
    Beiträge:
    119
    Geschlecht:
    männlich
    Spry Registerkarte auf "komplizierte" Tabelle anwenden
    AW: Spry Registerkarte auf "komplizierte" Tabelle anwenden

    hab jetzt deins genommen
    Unbenanntes Dokument
    geh dann ma auf den pfeil Bei der Hauptnavi links ... was hab ich falsch gemacht?
     
    #11      
  12. sokie

    sokie Mod | Web

    Dabei seit:
    23.03.2008
    Beiträge:
    5.338
    Geschlecht:
    männlich
    Ort:
    Bünde NRW
    Software:
    <br>COREL <br> Texteditor
    Spry Registerkarte auf "komplizierte" Tabelle anwenden
    AW: Spry Registerkarte auf "komplizierte" Tabelle anwenden

    da scheint aber jemand mehr Interesse daran zu haben Besucher abzuschrecken, als sie willkommen zu heissen. Sorry, dass ich Deinen Systemvorgaben nicht entspreche, und auch auf das andere keinen Bock habe. da klickt man doch gern auf "Seite verlassen".
     
    #12      
  13. metallica1990

    metallica1990 Nicht mehr ganz neu hier

    Dabei seit:
    20.08.2007
    Beiträge:
    119
    Geschlecht:
    männlich
    Spry Registerkarte auf "komplizierte" Tabelle anwenden
    AW: Spry Registerkarte auf "komplizierte" Tabelle anwenden

    tja ... wenigstens halte ich die pflicht ein, darauf hinzuweisen .. dass das abschreckendwirkt weiss ich und nehme ich momentan auch in kauf, da es eh nur eine baustelle ist
     
    #13      
  14. metallica1990

    metallica1990 Nicht mehr ganz neu hier

    Dabei seit:
    20.08.2007
    Beiträge:
    119
    Geschlecht:
    männlich
    Spry Registerkarte auf "komplizierte" Tabelle anwenden
    AW: Spry Registerkarte auf "komplizierte" Tabelle anwenden

    Hier der Betroffene Code
    HTML:
    1. <table border="0" align="center" cellpadding="0" cellspacing="5">
    2.         <tr>
    3.           <td valign="top"><table border="0" cellspacing="0" cellpadding="0">
    4.               <tr>
    5.                 <td><table width="157" border="0" cellpadding="0" cellspacing="0">
    6.                     <tr>
    7.                       <td><a href="#navi" class="slider"><img src="<?php echo $homepage_domain;?>images/leftcolumnheader_up.gif" width="49" height="36" alt="leftcolumnheader_up.gif" border="0"></a></td>
    8.                       <td width="92" height="36" valign="top" class="centercolumnheader"><table width="100%" border="0" cellspacing="0" cellpadding="0">
    9.                           <tr>
    10.                             <td height="9"></td>
    11.                           </tr>
    12.                           <tr>
    13.                             <td><font color="#B5B5B5" size="1" face="Verdana, Arial, Helvetica, sans-serif">Navigation</font></td>
    14.                           </tr>
    15.                       </table></td>
    16.                       <td><img src="<?php echo $homepage_domain;?>images/rightcolumnheader.gif" width="16" height="36" alt="rightcolumnheader.gif"></td>
    17.                     </tr>
    18.                   </table></td>
    19.               </tr>
    20.               <tr>
    21.                 <td>          
    22.                     <table width="100%" border="0" cellspacing="0" cellpadding="0" class="sideborders">
    23.                     <blockquote id="navi">
    24.                     <tr>
    25.                       <td height="15" bgcolor="#5C5E4F"><a href="<?php echo $homepage_domain;?>index.php">News</a>&nbsp;/&nbsp;<a href="<?php echo $homepage_domain;?>newsarchiv/index.php">Newsarchiv</a></td>
    26.                     </tr>
    27.                     <tr>
    28.                       <td class="dotborder" height="1"></td>
    29.                     </tr> <tr>
    30.                      <td height="15" bgcolor="#5C5E4F"><a href="<?php echo $homepage_domain;?>kontakt/index.php">Kontakt</a>&nbsp;/&nbsp;<a href="<?php echo $homepage_domain;?>uebermich/index.php">About</a></td>
    31.                     </tr>
    32.                     <tr>
    33.                       <td class="dotborder" height="1"></td>
    34.                     </tr>
    35.                     <tr>
    36.                       <td height="15" bgcolor="#5C5E4F"><a href="<?php echo $homepage_domain;?>links/index.php">Links</a>&nbsp;/&nbsp;<a href="<?php echo $homepage_domain;?>linkus/index.php">Verlinke mich!</a></td>
    37.                     </tr>
    38.                     <tr>
    39.                       <td class="dotborder" height="1"></td>
    40.                     </tr>
    41.                     <tr>
    42.                       <td height="15" bgcolor="#5C5E4F"><a href="<?php echo $homepage_domain;?>musik/index.php">Musik</a>&nbsp;/&nbsp;<a href="<?php echo $homepage_domain;?>meinelieblingsmusik/index.php">Lieblingsbands</a></td>
    43.                   </tr>
    44.                     <tr>
    45.                       <td class="dotborder" height="1"></td>
    46.                     </tr>
    47.                     <tr>
    48.                       <td height="15" bgcolor="#5C5E4F"><a href="<?php echo $homepage_domain;?>hardware/index.php">Hardware</a>&nbsp;/&nbsp;<a href="<?php echo $homepage_domain;?>software/index.php">Software</a></td>
    49.                     </tr>
    50.                     <tr>
    51.                       <td class="dotborder" height="1"></td>
    52.                     </tr>
    53.                     <tr>
    54.                       <td height="15" bgcolor="#5C5E4F"><a href="<?php echo $homepage_domain;?>informatik/index.php">Informatik</a>&nbsp;/&nbsp;<a href="<?php echo $homepage_domain;?>esportframe/index.php">Esports</a></td>
    55.                     </tr>
    56.                         <tr>
    57.                       <td class="dotborder" height="1"></td>
    58.                     </tr>
    59.                     <tr>
    60.                       <td height="15" bgcolor="#5C5E4F"><a href="<?php echo $homepage_domain;?>tippstricks/index.php">Tipps/Tricks</a>&nbsp;/&nbsp;<a href="<?php echo $homepage_domain;?>archiv/index.php">Archiv</a></td>
    61.                     </tr>
    62.                     </blockquote>
    63.                     <tr>
    64.                       <td class="dotborder" height="1"></td>
    65.                     </tr>
    66.                     <tr>
    67.                       <td class="dotborder" height="1"></td>
    68.                     </tr>
    69.                     <tr>
    70.                       <td class="dotborder" height="1"></td>
    71.                     </tr>
    72.                   </table>
    73.                  
    74.                  
    75.                  
    76.                  
    77.                  
    78.                 </td>
    79.               </tr>
    80.               <tr>
    81.                 <td><img src="<?php echo $homepage_domain;?>images/bottomcolumns.gif" width="157" height="9" alt="bottomcolumns.gif"></td>
    82.               </tr>
    83.             </table></td>
    84.         </tr>
    85.       </table>
     
    #14      
x
×
×
teststefan