# Pull-Down Menü für Touch-Display optimieren



## sight011 (7. März 2011)

Das Pull-Down Menü funktioniert auf Touch-Displays nicht.
Es geht um den Menüpunkt "Portfolio".
Hat jemand eine Idee?

http://www.foto-reinhardt.de/musik.html


----------



## Sebastian Apprecht (7. März 2011)

Hallo sight011,
zunächsteinmal habe ich mich gewundert, dass bei dem Portfolio einen 404er bekomme (von http://www.foto-reinhardt.de/kontakt.html).

Das Problem ist, dass es auf Touchoberflächen kein Hover-Ereignis gibt (bzw. es wird seltener getriggert). Ich würde das Ereignis "click" mit jQuery (ist ja auf der Seite drauf) abfangen und dann das Menü ebenfalls sichtbar machen.

Mit freundlichem Gruß aus Iserlohn,
Sebastian


----------



## sight011 (7. März 2011)

Auf meinem Pfolio geht es aber! ("hover")
http://adrianl.bplaced.net/webpage/

liegt wahrscheinlich irgendwie an den <a> Tags?!

der 404 ist nicht auf der kontakt Seite - sondern bei dem Link "Reportage" - weil mir da noch das Material gereicht wird.


ähm click? Ist das sehr umständlich - bei Java-S. bin ich noch ziemlich grün hinter den Ohren!
Bzw. wenn es mit "click" geht - hätte ich jetzt 0-Ahnung wie ich das umsetzen würde.
Muss ich die Navi dafür komplett umbauen? Oder einfach nur 1-2 Zeilen einfügen.

Ist Java-Script eigentlich auch Case-Sensitiv? Wo es hier gerade darum geht...


----------



## Sebastian Apprecht (7. März 2011)

Hallo,
das mit dem 404er habe ich mir schon gedacht, es war nur eine Anmerkung.


```
<script type="text/javascript">
<!--
$(document).ready(function(){
    $("#menue span").click(function(){
      if( !$(this).hasClass("selected") ) {
        $(this).addClass("selected");
      }
      else {
        $(this).removeClass("selected");
      }
    });
});
//-->
</script>
```

das sollte der mehr oder weniger 2-3 Zeiler sein, weiter musst du dann den CSS um das "selected" ergänzen (.aussen:hover, .selected). Natürlich ungetestet und ohne Gewähr .

Ja, das kann auch an den "Links" liegen, da das Portfolio in diesem Sinne kein Link ist und die Pseudoklassen theoretisch von allen HTML-Elementen genutzt werden können, jedoch werden die nicht von allen Browsern auf jedem Element interpretiert.

kleine Styleanmerkung:
Warum eigentlich "Kontakt | Impressum"? Laut deutschem Recht reicht "Kontakt"! 

ansonsten ists ja schick! Um ganz genau zu sein ist der Codestyle ein wenig eigen - aber jedem das seine .

Und zur lezten Frage: Ob JavaScript case sensitive sei: ein ganz klares Ja!

Grüße und einen schönen Abend,
Sebastian


----------



## sight011 (8. März 2011)

Oah - das ist total nett.

Was meinst Du mit eigen?
Also welche/s Element/e?

Gruß


----------



## Sebastian Apprecht (8. März 2011)

Eigen ist die Kombination aus gekapselten DIV's, SPAN's und Links. Ich würde eine geschachtelte ungeordnete Liste mit Links benutzen, das wäre dann ein wenig näher dem "Best Practice" der Brache.

Für ein schnelleres und strukturierteres Alignment empfehle ich Dir CSS-Frameworks wie blueprint oder 960.gs. Wie der Rest ist auch das reine Geschmackssache!

Grüße,
Sebastian


----------



## sight011 (11. März 2011)

http://foto-reinhardt.de/-Backup/pulldown.html

Habe das script im header platztiert und die Klasse ganz am Ende umbenannt. Nur funktionieren tut es nicht!

Bitte lach mich jetzt nicht aus - ich hab davon nunmal keine Ahnung, kann es sein das ich alles an der falschen Stelle eingefügt habe?


----------



## sight011 (13. März 2011)

Bekomme es nicht hin echt schade


----------



## chmee (13. März 2011)

Sebastian, könntest Du nen Link geben, wo beschrieben ist, dass ein Impressum nicht nötig sei? Grad in D kenne ich es, dass das Impressum verpflichtend ist, sobald ein kommerzieller Hintergrund erkennbar wird.

mfg chmee


----------



## Sebastian Apprecht (14. März 2011)

@chmee:
entschuldige die späte Antwort: ich habe nicht gesagt, das kein Impressum nötig sei, ich habe lediglich gesagt, dass die Benennung von diesem mit "Kontakt" ausreichend sei.

Wenn ich nun mal Wikipedia zitieren darf:


> Da weder das Teledienste-Gesetz noch der Rundfunkstaatsvertrag den Begriff „Impressum“ verwendeten, sondern lediglich von Informationspflichten sprechen, haben sich verschiedene Bezeichnungen für diese Pflichtangaben etabliert. Neben dem gebräuchlichsten Begriff „Impressum“ sind dies zum Beispiel: „Webimpressum“, „Anbieterkennzeichnung“ oder auch „Kontakt“.



Wenn's nach mir geht, ist dies auch eine Sache der Verhältnismäßigkeit: bei einem Anwalt oder einem größerem Konzern erwarte ich das Wort "Impressum" und auch nur das, bei einem Künstler, Freiberufler o.ä. Freinatur darf das Ganze auch entsprechend freier ausfallen, solange erkennbar ist, wo diese Daten zu finden sind.

@sight011: versuch's mal ohne den Script mit ungeordneten Listen und Ankern in Reinform: ich hab mir nu noch nicht auf nem Apfelgerät angesehen aber ich mein in Erinnerung zu haben, das die die Hover-Geschichten auch nur bei Links triggern.

Grüße,
Sebastian


----------



## chmee (14. März 2011)

Danke, wieder was gelernt. Dann erspare ich mir die Benennung Impressum auch auf meiner Seite - ich find sie nämlich scheußlich.

mfg chmee


----------



## sight011 (8. April 2011)

Chmee

Fürs Protokoll:

Einfach nur mit Listen zu arbeiten brachte nix - als ich aus "Portfoio" enen Link gemacht habe, dann ging es das der Hover Effekt ausgeführt wurde.
Blöderweise gibt es die Seite Portfolio als soche nicht!

Kann man da sowas angeben wie auf der selben Seite bleiben vielelicht einfach in das Tag nen /     ?

Mfg Danke noch mal für die Hilfe


----------



## Sebastian Apprecht (9. April 2011)

Nimm ne Raute ("#") als Linkziel - zumindest wäre das die schnellste Variante, die mir grade einfällt.


----------



## Maniac (11. April 2011)

Sebastian Apprecht hat gesagt.:


> Nimm ne Raute ("#") als Linkziel - zumindest wäre das die schnellste Variante, die mir grade einfällt.


 
Mit der Raute (dient zum weiterleiten auf Anker) kann es sein das beim klick darauf der Brwoser scrollt, weil er denkt das er zu einem Anker leiten muss, aber keinen findet geht er ganz nach oben (top). Wäre bei einer Navigation jetzt nicht schlimm, da sie eh ganz oben ist.
Dieses kann man umgehen indem man

```
<a href="javascript:void(0);">Anker</a>
```

angibt.


----------

