Max Mustermann: Text beim Klick (mehrmals!) ändern

Hallo!

Meine Website hat eine russische Deklinationstabelle zu bieten, die zurzeit so aufgebaut ist, dass die Wörter zunächst in kyrillischer Schrift erscheinen, beim Klicken aber in der ISO-Transliteration. Dies habe ich mit onclick="this.firstChild.nodeValue = 'XY'" hinbekommen.

Nun möchte ich aber auch, dass nach dem _zweiten_ Klick die deutsche Transkription angezeigt wird. Außerdem möchte ich ein paar Formatierungen bei dem erscheinenden Text vornehmen, was damit leider nicht möglich ist.

Hat jemand Vorschläge für mich?

Vielen Dank!

  1. Om nah hoo pez nyeetz, Max Mustermann!

    Außerdem möchte ich ein paar Formatierungen bei dem erscheinenden Text vornehmen, was damit leider nicht möglich ist.

    Formatierungen beeinflusst du, indem du die Klassenzugehörigkeit der entsprechenden Elemente änderst.

    Matthias

    --
    1/z ist kein Blatt Papier. http://www.billiger-im-urlaub.de/kreis_sw.gif
  2. @@Max Mustermann:

    nuqneH

    Meine Website hat eine russische Deklinationstabelle zu bieten, die zurzeit so aufgebaut ist, dass die Wörter zunächst in kyrillischer Schrift erscheinen, beim Klicken aber in der ISO-Transliteration. Dies habe ich mit onclick="this.firstChild.nodeValue = 'XY'" hinbekommen.

    Hm, vermutlich schlecht. Du pflegst die Texte an unterschiedlichen Stellen? Die in kyrillischer Schrift im HTML und die in lateinischer Schrift in JavaScript? Ungünstig.

    Besser so:

    <span lang="ru" class="Cyrl">язык</span>  
    <span lang="ru-Latn" class="Latn-transliteration">âzyk</span>  
    <span lang="ru-Latn" class="Latn-transcription-de">jasyk</span>
    

    Ohne JavaScript lässt du alles anzeigen. Mit JavaScript setzt du eine Klasse fürs 'html'-Element

    document.documentElement.className += " js";

    und blendest initial die Umschreibungen mit lateinischen Buchstaben aus:

    .js .Latn-transliteration, .js .Latn-transcription-de { display: none }

    Mit JavaScript setzt du auf die Clicks bei einem geeigneten Element (das könnte dein 'table'-Element sein oder 'body' eine Klasse:

    document.body.className = (document.body.className != "show-Latn-transliteration" ? "show-Latn-transliteration" : "show-Latn-transcription-de";

    Nun möchte ich aber auch, dass nach dem _zweiten_ Klick die deutsche Transkription angezeigt wird.

    Das erledigt obige Zeile gleich mit.

    Im Stylesheet steht dazu noch:

    .js .show-Latn-transliteration .Cyrl, .js .show-Latn-transcription-de .Cyrl { display: none }  
    .js .show-Latn-transliteration .Latn-transliteration, .js .show-Latn-transcription-de .Latn-transcription-de { display: inline }
    

    Außerdem möchte ich ein paar Formatierungen bei dem erscheinenden Text vornehmen, was damit leider nicht möglich ist.

    Damit schon.

    Qapla'

    --
    Gut sein ist edel. Andere lehren, gut zu sein, ist noch edler. Und einfacher.
    (Mark Twain)
    1. @@Max Mustermann:

      nuqneH

      Meine Website hat eine russische Deklinationstabelle zu bieten, die zurzeit so aufgebaut ist, dass die Wörter zunächst in kyrillischer Schrift erscheinen, beim Klicken aber in der ISO-Transliteration. Dies habe ich mit onclick="this.firstChild.nodeValue = 'XY'" hinbekommen.

      Hm, vermutlich schlecht. Du pflegst die Texte an unterschiedlichen Stellen? Die in kyrillischer Schrift im HTML und die in lateinischer Schrift in JavaScript? Ungünstig.

      Besser so:

      <span lang="ru" class="Cyrl">язык</span>

      <span lang="ru-Latn" class="Latn-transliteration">âzyk</span>
      <span lang="ru-Latn" class="Latn-transcription-de">jasyk</span>

      
      >   
      > Ohne JavaScript lässt du alles anzeigen. Mit JavaScript setzt du eine Klasse fürs 'html'-Element  
      >   
      > `document.documentElement.className += " js";`{:.language-javascript}  
      >   
      > und blendest initial die Umschreibungen mit lateinischen Buchstaben aus:  
      >   
      > `.js .Latn-transliteration, .js .Latn-transcription-de { display: none }`{:.language-css}  
      >   
      >   
      >   
      >   
      > Mit JavaScript setzt du auf die Clicks bei einem geeigneten Element (das könnte dein 'table'-Element sein oder 'body' eine Klasse:  
      >   
      > `document.body.className = (document.body.className != "show-Latn-transliteration" ? "show-Latn-transliteration" : "show-Latn-transcription-de";`{:.language-javascript}  
      >   
      >   
      > > Nun möchte ich aber auch, dass nach dem \_zweiten\_ Klick die deutsche Transkription angezeigt wird.  
      >   
      > Das erledigt obige Zeile gleich mit.  
      >   
      > Im Stylesheet steht dazu noch:  
      >   
      > ~~~css
      
      .js .show-Latn-transliteration .Cyrl, .js .show-Latn-transcription-de .Cyrl { display: none }  
      
      > .js .show-Latn-transliteration .Latn-transliteration, .js .show-Latn-transcription-de .Latn-transcription-de { display: inline }
      
      

      Außerdem möchte ich ein paar Formatierungen bei dem erscheinenden Text vornehmen, was damit leider nicht möglich ist.

      Damit schon.

      Qapla'

      Bitte verzeihe mir mein Unwissen, aber wo genau kommt was hin? Kommt der ganze Javascript-Teil in den <script>-Bereich oder muss auch etwas in die Tabelle? Kannst du das nicht lieber in dem Schema darstellen:

        
      <style type="text/css">  
      XY  
      </style>  
      <script type="text/javascript">  
      XY  
      </script>  
      <table>  
      <tr>  
      <td>(язык, âzyk, jasyk)</td>  
      </tr>  
      </table>  
      
      

      Danke!

      1. Om nah hoo pez nyeetz, Max Mustermann!

        Bitte verzeihe mir mein Unwissen, aber wo genau kommt was hin?

        #1# Es ist unnötig, das ganze Posting zu zitieren, zumal du eigentlich überhaupt nicht darauf eingehst.

        #2# Wie ist es denn um deine Grundlagen bestellt?

        #3# Was ist in Gunnars Posting JS, was HTML, was CSS?

        Matthias

        --
        1/z ist kein Blatt Papier. http://www.billiger-im-urlaub.de/kreis_sw.gif
        1. Om nah hoo pez nyeetz, Max Mustermann!

          Bitte verzeihe mir mein Unwissen, aber wo genau kommt was hin?

          #1# Es ist unnötig, das ganze Posting zu zitieren, zumal du eigentlich überhaupt nicht darauf eingehst.

          Wie kommst du darauf?

          #2# Wie ist es denn um deine Grundlagen bestellt?

          Ich habe eigentlich keine Ahnung von Javascript, CSS und HTML kann ich gut verstehen.

          #3# Was ist in Gunnars Posting JS, was HTML, was CSS?

          Das weiß ich, aber mir hilft es nicht weiter, da ich Javascript auch in ein HTML-Tag einbauen kann.

    2. @@Gunnar Bittersmann:

      nuqneH

      <span lang="ru" class="Cyrl">язык</span>

      <span lang="ru-Latn" class="Latn-transliteration">âzyk</span>
      <span lang="ru-Latn" class="Latn-transcription-de">jasyk</span>

        
      Man könnte auch die Schrift-Information mit in die Sprachkennzeichnungen mit hineinnehmen  
        
      ~~~html
      <span lang="ru-Cyrl">язык</span>  
      <span lang="ru-Latn-x-transliteration">âzyk</span>  
      <span lang="ru-Latn-x-transcription-de">jasyk</span>
      

      und die Pseudoklasse :lang() zum Stylen verwenden. Allerdings kennt der IE diese erst ab Version 8.

      Ohne JavaScript lässt du alles anzeigen.

      Will man das wirklich? Vielleicht ist es in dem Fall besser, nur die Wörter in kyrillischer Schrift anzuzeigen und auf das Gimmick von Transliteration und Transkription zu verzichten.

      Qapla'

      --
      Gut sein ist edel. Andere lehren, gut zu sein, ist noch edler. Und einfacher.
      (Mark Twain)
  3. @@Max Mustermann:

    nuqneH

    beim Klicken aber in der ISO-Transliteration.

    Beim Klicken worauf? Willst du einen Button, der die Anzeige

    Nominativ язык
    Genitiv языка

    ändert in

    Nominativ âzyk
    Genitiv âzyka

    oder soll beim Klcik auf ein Wort (bspw. язык) nur dieses in lateinischer Transliteration angezeigt werden?

    Nominativ âzyk
    Genitiv языка

    Qapla'

    PS: Wer braucht bei einer Deklinationstabelle eine Transliteration? Wenn die Russischkenntnisse schon so weit fortgeschritten sind, sollte man schon kyrillische Schrift lesen können.

    --
    Gut sein ist edel. Andere lehren, gut zu sein, ist noch edler. Und einfacher.
    (Mark Twain)
    1. @@Max Mustermann:
      oder soll beim Klcik auf ein Wort (bspw. язык) nur dieses in lateinischer Transliteration angezeigt werden?

      Genau!

      PS: Wer braucht bei einer Deklinationstabelle eine Transliteration? Wenn die Russischkenntnisse schon so weit fortgeschritten sind, sollte man schon kyrillische Schrift lesen können.

      Zum Lesen einer Deklinationstabelle braucht man doch keine Russischkenntnisse, vielmehr erhält man sie dadurch.

      1. @@Max Mustermann:

        nuqneH

        oder soll beim Klcik auf ein Wort (bspw. язык) nur dieses in lateinischer Transliteration angezeigt werden?

        Genau!

        Hm, ich habe Zweifel an der Sinnhaftigkeit des Unterfangens.

        Warum gibst du die Umschriften nicht einfach im Tooltip an?

        <span lang="ru" title="âzyk – jasyk">язык</span>

        Qapla'

        --
        Gut sein ist edel. Andere lehren, gut zu sein, ist noch edler. Und einfacher.
        (Mark Twain)
        1. @@Max Mustermann:

          nuqneH

          oder soll beim Klcik auf ein Wort (bspw. язык) nur dieses in lateinischer Transliteration angezeigt werden?

          Genau!

          Hm, ich habe Zweifel an der Sinnhaftigkeit des Unterfangens.

          Warum gibst du die Umschriften nicht einfach im Tooltip an?

          <span lang="ru" title="âzyk – jasyk">язык</span>

          Qapla'

          Da hast du Recht, das ist sinnvoller.

          Danke!