jus2: Zusammengesetzter Link

Hallo zusammen.

Ich hoffe, ich mache diesmal alles richtig und meine Vorstellung ist realisierbar.

Ich bin dabei mir eine Kleine HP zu programmieren, die sich komplett auf HTML stützt.

Ich versuche mit einem Dropdownmenü einen Teil des Links fest zu legen.

Z.b. ein Verweis auf D:\Homepage\Daten........\Bilder.html

Jetzt möchte ich durch ein Drodownmenü den ordnernamen für die Punkte zu setzen z.b. Urlaub.

Das wäre dann D:\Homepage\Daten\Urlaub\Bilder.html

So dass sich der Nutzer die Seite wählen kann.

Verweisen soll ein weiterer Button oder ein einfacher Link.

Funktioniert das und wenn ja, wie?

Ich habe so ne leise Ahnung aber möchte nichts falsch machen.

  1. Mit JavaScript am besten. Dann sei dir aber bewusst dass ohne Script (und sowas gibt es) nichts mehr funktioniert.
    Und das würde bedeuten dass es alle Kombinationen aus erstem und zweiten Teil auch geben müsste.
    Denk doch mal über eine Linksammlung nach, wo man einfach durch einen Klick irgendwohin kommt. Was du schreibst kann zwar schon funktionieren, aber es ist sauumständlich.

    1. Danke, dass du so schnell antwortest.

      Javascript ist nicht meine Sprache. Es macht mir allerdings nichts aus, einen solchen Code einzufügen d.h. damit zu arbeiten.

      Wenn du mir sagen kannst, wo ich solch einen Code her bekomme, wäre das perfekt. Wenn du selbst einen hast, her damit :D

      Wie soll das mit ner Linksammlung aussehen?

      Soll ich einen Riesigen KAsten machen, wo alle Arten drin stehen uns für jeden den einzelnen link?

      Angenommen, ich nehme das beispiel von oben.

      Das wären dann:
      Urlaub, Freizeit, Privat, Freunde, und vielleicht noch sonstiges.

      Das sollte in nem Dropdiownmenü sein.

      Und der dazugehörige Link:
      2000, 2001, 2002, 2003, 2004, 2005, 2006, 2007, 2008, 2009, 2010.

      Das wären dann 55 Links :(

      1. Das wären dann:
        Urlaub, Freizeit, Privat, Freunde, und vielleicht noch sonstiges.
        Und der dazugehörige Link:
        2000, 2001, 2002, 2003, 2004, 2005, 2006, 2007, 2008, 2009, 2010.
        Das wären dann 55 Links :(

        So ganz habe ich dein Anliegen nicht verstanden, aber wenn du bei HTML (+CSS nehme ich an) bleiben willst wäre die eine Möglichkeit Unterseiten zu machen. Also eine Linkliste die Aufführt:
        Urlaub, Freizeit, Privat, Freunde, sonstiges, 2000, 2001, 2002, 2003, 2004, 2005, 2006, 2007, 2008, 2009, 2010.
        Und wenn ich z.B. auf "Freunde" klicke lädst du eine Seite in der ich das Jahr auswählen kann. Klicke ich auf 2002 lädst du eine Seite in der ich das Themengebiet (Urlaub, Freizeit...) wählen kann.

        Oder du realisierst tatsächlich 55 Links mit versteckenden CSS-Elementen. Du findest sowas wenn du im Netz nach "Untermenüs" sucht o.ä.
        Die Technik dabei ist relativ simpel du hast halt deine fünf Kategorien als Text und wenn man mit der Maus darüber fährt würden die entsprechenden Jahre eingeblendet (die dann Links sind).
        So sind immer fünf Texte oder fünf Texte und elf Links zu sehen obwohl natürlich die ganze Zeit 55 da sind (nur eben nicht sichtbar).

        --
        sh:( fo:| ch:? rl:( br:& n4:& ie:{ mo:} va:) de:µ_de:] zu:) fl:( ss:| ls:[ js:(
        1. ich machs nicht direkt so wie du sagst!

          aber du hast mich auf frames gebracht.
          das wäre nicht schlecht.

          und em, das mit dem Urlaub war ein Beispiel. ich mach das nicht für Private sachen!

          1. ich machs nicht direkt so wie du sagst!

            Einverstanden ^^

            aber du hast mich auf frames gebracht.

            Neeeeiiiin. Das lag überhaupt nicht in meiner Absicht!

            das wäre nicht schlecht.

            Doch das wäre es, es gibt DIVERSE Nachteile, die Frames bieten in der Umkehrung gibt es nur sehr wenige Use-Cases, in denen sie Sinn machen (und das primär in Intranets).

            Da ist es mir lieber, dass ich das Problem komplett für dich löse... kleinen Moment...

            --
            sh:( fo:| ch:? rl:( br:& n4:& ie:{ mo:} va:) de:µ_de:] zu:) fl:( ss:| ls:[ js:(
            1. Da ist es mir lieber, dass ich das Problem komplett für dich löse... kleinen Moment...

              <!DOCTYPE HTML>
              <html>
               <head>
                <title>Linkliste mit 55 verschiedenen Links</title>
                <style type="text/css">
                 .liste1 li{
                  position:relative;
                  width:5em;
                 }
                 .liste1 li .liste2 {
                  display:none;
                  position:absolute;
                  top:0;
                  left:5em;
                  background-color:#abcdef;
                 }
                 .liste1 li:hover .liste2 {
                  display:block;
                 }
                </style>
               </head>
               <body>
                <ul class="liste1">
                 <li>Urlaub
                  <ul class="liste2">
                   <li><a href="./Urlaub/2000">2000</a></li>
                   <li><a href="./Urlaub/2001">2001</a></li>
                   <li><a href="./Urlaub/2002">2002</a></li>
                   <li><a href="./Urlaub/2003">2003</a></li>
                   <li><a href="./Urlaub/2004">2004</a></li>
                   <li><a href="./Urlaub/2005">2005</a></li>
                   <li><a href="./Urlaub/2006">2006</a></li>
                   <li><a href="./Urlaub/2007">2007</a></li>
                   <li><a href="./Urlaub/2008">2008</a></li>
                   <li><a href="./Urlaub/2009">2009</a></li>
                   <li><a href="./Urlaub/2010">2010</a></li>
                  </ul>
                 </li>
                 <li>Freizeit
                  <ul class="liste2">
                   <li><a href="./Freizeit/2000">2000</a></li>
                   <li><a href="./Freizeit/2001">2001</a></li>
                   <li><a href="./Freizeit/2002">2002</a></li>
                   <li><a href="./Freizeit/2003">2003</a></li>
                   <li><a href="./Freizeit/2004">2004</a></li>
                   <li><a href="./Freizeit/2005">2005</a></li>
                   <li><a href="./Freizeit/2006">2006</a></li>
                   <li><a href="./Freizeit/2007">2007</a></li>
                   <li><a href="./Freizeit/2008">2008</a></li>
                   <li><a href="./Freizeit/2009">2009</a></li>
                   <li><a href="./Freizeit/2010">2010</a></li>
                  </ul>
                 </li>
                 <li>Privat
                  <ul class="liste2">
                   <li><a href="./Privat/2000">2000</a></li>
                   <li><a href="./Privat/2001">2001</a></li>
                   <li><a href="./Privat/2002">2002</a></li>
                   <li><a href="./Privat/2003">2003</a></li>
                   <li><a href="./Privat/2004">2004</a></li>
                   <li><a href="./Privat/2005">2005</a></li>
                   <li><a href="./Privat/2006">2006</a></li>
                   <li><a href="./Privat/2007">2007</a></li>
                   <li><a href="./Privat/2008">2008</a></li>
                   <li><a href="./Privat/2009">2009</a></li>
                   <li><a href="./Privat/2010">2010</a></li>
                  </ul>
                 </li>
                 <li>Freunde
                  <ul class="liste2">
                   <li><a href="./Freunde/2000">2000</a></li>
                   <li><a href="./Freunde/2001">2001</a></li>
                   <li><a href="./Freunde/2002">2002</a></li>
                   <li><a href="./Freunde/2003">2003</a></li>
                   <li><a href="./Freunde/2004">2004</a></li>
                   <li><a href="./Freunde/2005">2005</a></li>
                   <li><a href="./Freunde/2006">2006</a></li>
                   <li><a href="./Freunde/2007">2007</a></li>
                   <li><a href="./Freunde/2008">2008</a></li>
                   <li><a href="./Freunde/2009">2009</a></li>
                   <li><a href="./Freunde/2010">2010</a></li>
                  </ul>
                 </li>
                 <li>sonstiges
                  <ul class="liste2">
                   <li><a href="./sonstiges/2000">2000</a></li>
                   <li><a href="./sonstiges/2001">2001</a></li>
                   <li><a href="./sonstiges/2002">2002</a></li>
                   <li><a href="./sonstiges/2003">2003</a></li>
                   <li><a href="./sonstiges/2004">2004</a></li>
                   <li><a href="./sonstiges/2005">2005</a></li>
                   <li><a href="./sonstiges/2006">2006</a></li>
                   <li><a href="./sonstiges/2007">2007</a></li>
                   <li><a href="./sonstiges/2008">2008</a></li>
                   <li><a href="./sonstiges/2009">2009</a></li>
                   <li><a href="./sonstiges/2010">2010</a></li>
                  </ul>
                 </li>
                 <li>2000
                  <ul class="liste2">
                   <li><a href="./Urlaub/2000"   >Urlaub</a></li>
                   <li><a href="./Freizeit/2000" >Freizeit</a></li>
                   <li><a href="./Privat/2000"   >Privat</a></li>
                   <li><a href="./Freunde/2000"  >Freunde</a></li>
                   <li><a href="./sonstiges/2000">sonstiges</a></li>
                  </ul>
                 </li>
                 <li>2001
                  <ul class="liste2">
                   <li><a href="./Urlaub/2001"   >Urlaub</a></li>
                   <li><a href="./Freizeit/2001" >Freizeit</a></li>
                   <li><a href="./Privat/2001"   >Privat</a></li>
                   <li><a href="./Freunde/2001"  >Freunde</a></li>
                   <li><a href="./sonstiges/2001">sonstiges</a></li>
                  </ul>
                 </li>
                 <li>2002
                  <ul class="liste2">
                   <li><a href="./Urlaub/2002"   >Urlaub</a></li>
                   <li><a href="./Freizeit/2002" >Freizeit</a></li>
                   <li><a href="./Privat/2002"   >Privat</a></li>
                   <li><a href="./Freunde/2002"  >Freunde</a></li>
                   <li><a href="./sonstiges/2002">sonstiges</a></li>
                  </ul>
                 </li>
                 <li>2003
                  <ul class="liste2">
                   <li><a href="./Urlaub/2003"   >Urlaub</a></li>
                   <li><a href="./Freizeit/2003" >Freizeit</a></li>
                   <li><a href="./Privat/2003"   >Privat</a></li>
                   <li><a href="./Freunde/2003"  >Freunde</a></li>
                   <li><a href="./sonstiges/2003">sonstiges</a></li>
                  </ul>
                 </li>
                 <li>2004
                  <ul class="liste2">
                   <li><a href="./Urlaub/2004"   >Urlaub</a></li>
                   <li><a href="./Freizeit/2004" >Freizeit</a></li>
                   <li><a href="./Privat/2004"   >Privat</a></li>
                   <li><a href="./Freunde/2004"  >Freunde</a></li>
                   <li><a href="./sonstiges/2004">sonstiges</a></li>
                  </ul>
                 </li>
                 <li>2005
                  <ul class="liste2">
                   <li><a href="./Urlaub/2005"   >Urlaub</a></li>
                   <li><a href="./Freizeit/2005" >Freizeit</a></li>
                   <li><a href="./Privat/2005"   >Privat</a></li>
                   <li><a href="./Freunde/2005"  >Freunde</a></li>
                   <li><a href="./sonstiges/2005">sonstiges</a></li>
                  </ul>
                 </li>
                 <li>2006
                  <ul class="liste2">
                   <li><a href="./Urlaub/2006"   >Urlaub</a></li>
                   <li><a href="./Freizeit/2006" >Freizeit</a></li>
                   <li><a href="./Privat/2006"   >Privat</a></li>
                   <li><a href="./Freunde/2006"  >Freunde</a></li>
                   <li><a href="./sonstiges/2006">sonstiges</a></li>
                  </ul>
                 </li>
                 <li>2007
                  <ul class="liste2">
                   <li><a href="./Urlaub/2007"   >Urlaub</a></li>
                   <li><a href="./Freizeit/2007" >Freizeit</a></li>
                   <li><a href="./Privat/2007"   >Privat</a></li>
                   <li><a href="./Freunde/2007"  >Freunde</a></li>
                   <li><a href="./sonstiges/2007">sonstiges</a></li>
                  </ul>
                 </li>
                 <li>2008
                  <ul class="liste2">
                   <li><a href="./Urlaub/2008"   >Urlaub</a></li>
                   <li><a href="./Freizeit/2008" >Freizeit</a></li>
                   <li><a href="./Privat/2008"   >Privat</a></li>
                   <li><a href="./Freunde/2008"  >Freunde</a></li>
                   <li><a href="./sonstiges/2008">sonstiges</a></li>
                  </ul>
                 </li>
                 <li>2009
                  <ul class="liste2">
                   <li><a href="./Urlaub/2009"   >Urlaub</a></li>
                   <li><a href="./Freizeit/2009" >Freizeit</a></li>
                   <li><a href="./Privat/2009"   >Privat</a></li>
                   <li><a href="./Freunde/2009"  >Freunde</a></li>
                   <li><a href="./sonstiges/2009">sonstiges</a></li>
                  </ul>
                 </li>
                 <li>2010
                  <ul class="liste2">
                   <li><a href="./Urlaub/2010"   >Urlaub</a></li>
                   <li><a href="./Freizeit/2010" >Freizeit</a></li>
                   <li><a href="./Privat/2010"   >Privat</a></li>
                   <li><a href="./Freunde/2010"  >Freunde</a></li>
                   <li><a href="./sonstiges/2010">sonstiges</a></li>
                  </ul>
                 </li>
                </ul>
                <!--
                Urlaub, Freizeit, Privat, Freunde, und vielleicht noch sonstiges. 2000, 2001, 2002, 2003, 2004, 2005, 2006, 2007, 2008, 2009, 2010.
                -->
               </body>
              </html>
              
              

              Wer hat dir denn diesen Frames-Floh ins Ohr gesetzt? Ich weigere mich zu glauben dass ich das gewesen sein soll. Ich würde mich freuen, wenn du dich dazu äußerst, immerhin hatte ich auch 10 Minuten Arbeit damit :)

              Ach ja: Und für welche Nutzdaten du das dann verwendest und ob die Links auf einen "Ordner" (aka Verzeichnis oder Verzeichnis-Index) zeigen oder auf ein einzelnes Bild oder eine Galerie von Bildern ist natürlich Wurst :)

              --
              sh:( fo:| ch:? rl:( br:& n4:& ie:{ mo:} va:) de:µ_de:] zu:) fl:( ss:| ls:[ js:(
              1. omg, so was nettes hab ich auch noch nie erlebt.

                Herzlichen dank für deine Hilfe!!!!

                Frames gefallen mir irgendwie.
                gibt tolle möglichkeiten dadurch aber eben auch nachteile.
                Da der ganze mist sowiso nur für wenige leute ist, wäre das schon machebar.

                Ich hoffe, du kannst mir auch bei meinem nächsten Problem weiterhelfen.
                Ich werde ein neues Thema eröffen, falls ich nichts darüber finde: ScrollTo.

                1. em leuz,

                  danke auf jeden fall für den code aber ich brauche doch eher das, was ich geschrieben hatte!

                  1. <script type="text/javascript">  
                    function CheckAuswahl() {  
                      for (i = 0; i < document.Testform.Auswahl.length; ++i)  
                        if (document.Testform.Auswahl.options[i].selected == true)  
                          parent.frames[1].location.href=("Erster teil"+ document.Testform.Auswahl.options[i].value +"zweiter teil");  
                    }  
                    </script>
                    

                    im head. if (document.Testform.Auswahl.options[i].selected == true) ist zeile 22

                    <form name="Testform" action="">  
                    <select name="Auswahl" size="1" onchange="CheckAuswahl()">  
                    <option value="1">1 select</option>  
                    <option value="2">2 select</option>  
                    </select>  
                    </form>
                    

                    im body

                    Diesmal hab ich sogar in der fehlerkosole geguckt:

                    Fehler: document.Testform.Auswahl is undefined
                    Quelldatei: file:///meine seite.html Zeile: 22

                    1. ok, passt ^^

              2. Om nah hoo pez nyeetz, Deus Figendi!

                Da haben wir ja deine schwache Stelle gefunden. Ich hab auch ein Problem, was ich jetzt mit Frames löse ;-)

                Matthias

                --
                1. Om nah hoo pez nyeetz, Deus Figendi!

                  Da haben wir ja deine schwache Stelle gefunden. Ich hab auch ein Problem, was ich jetzt mit Frames löse ;-)

                  Dieses Risiko war mir durchaus bewusst Matthias, aber ich war bereit es einzugehen.
                  Wenn du dich im Archiv o.ä. aber umsiehst wirst, du merken, dass ich öfters durchaus mal bereit bin 'ne Stange Code zu spendieren, wenn es nicht zu aufwendig ist. Immerhin kann man an Beispielen oft genausogut wenn nicht besser lernen als an langatmigen Erklärungen (die ich ja vorher abgegeben habe alá "machsu Liste und in Listenpunkt kommt noch ne Box und die blendest du aus und bei hover wieder ein..." Das ist für einen Anfänger wahrscheinlich eh zu oberflächlich behandelt. Wenn er diese Challange annimmt, wird er eine Menge Begriffe nachschlagen müssen oder schauen wie etwas funktioniert (z.B. "ausblenden von Elementen") ich habe nicht mal was zur Positionierung geschrieben, was im obrigen Code wahrscheinlich das schwierigste sein dürfte.
                  Die Knappheit meiner Ausführung ist aber oftmals auch der Tatsache geschuldet, dass ich hier Morgens vor der Arbeit reinschaue und dann natürlich nicht beliebig Zeit habe ^^.

                  Aber wie gesagt, war nicht das erste Mal, dass ich Code spendierte, ich bin ja auch ein Freund der FOSS-Bewegung :) Und im Gegensatz zu manch anderem OpenSource-Entwickler bin ich durchaus bereit hier und da mal schlampigen q'n'd-Code offen zu legen, wenn ich selber eh keinen Bock habe das "sauber" zu machen. Dann kann sich dem jemand anderes annehmen... oder eben auch nicht :)

                  --
                  sh:( fo:| ch:? rl:( br:& n4:& ie:{ mo:} va:) de:µ_de:] zu:) fl:( ss:| ls:[ js:(
                  1. Om nah hoo pez nyeetz, Deus Figendi!

                    und meine vollste Zustimmung. Ich hatte hier schon ebensolche positive Erlebnisse.

                    Matthias

                    --
      2. Wenn du mir sagen kannst, wo ich solch einen Code her bekomme, wäre das perfekt. Wenn du selbst einen hast, her damit :D

        Wenn du ein bisschen JS könntest wären das ein paar Zeilen. Mit getElementById kommst du auf die Combobox, dann den Wert auslesen und zusammenbauen. Ich hab grad nichts fertiges, http://de.selfhtml.org/javascript/objekte/options.htm@title=hier gibts schon mal einen Anfang.
        Aber wie gesagt, ich halte das sowieso für eine recht ungewohnte und komplizierte Art der Auswahl.

        Soll ich einen Riesigen KAsten machen, wo alle Arten drin stehen uns für jeden den einzelnen link?
        Das wären dann 55 Links :(

        Dafür weiß man allerdings wo man hinkommt wenn man wo klickt. Und man kommt dort sehr leicht hin. Die meisten sind mit Combboxen doch schon mal überfordert.

        Und wenn ich mir die Stichwörter so ansehe, die sind sowieso nicht eindeutig. Wenn du mit deinen Freunden in Urlaub fährst, ist das auch privat und Freizeit. Also wohin mit so einem Ereignis? ;-)
        Ein gut gemeinter Tip. Man kann viel mit JS machen, aber man kann sich auch verzetteln. Bevor du dann in vielen Kombinationen gar nichts oder nur eine einzige Aktion stehen hast, vielleicht reicht es dir ja auch wenn du einfach so eine Liste bringst?
        2005 - Urlaub in ...
        2005 - Geburtstag von ...
        2006 - Hochzeit von ...
        Die ist überschaubar und macht auch nach ein paar Klicks noch Laune um weiterzuschauen.

  2. Hoi!

    Was spricht denn gegen eine serverseitige Lösung?

    --
    "Die Diebesgilde beklagte sich darueber, dass Mumm in aller Oeffentlichkeit behauptet hatte, hinter den meisten Diebstaehlen steckten Diebe."
          - T. Pratchett
    1. Hoi!

      Was spricht denn gegen eine serverseitige Lösung?

      wenn du mir sagst, wie, wäre ich interessiert.