zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden Click-on-Men

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 05.01.2015, 10:24
Benutzerbild von seelefant
Erfahrener Benutzer
XHTMLforum-Mitglied
Thread-Ersteller
 
Registriert seit: 29.01.2006
Ort: im Steirischen Salzkammergut
Beiträge: 260
seelefant wird schon bald berühmt werden
Standard Click-on-Men

Hallo zusammen und ein gutes Jahr 2015 wünsche ich Euch!

In einem Shop-Projekt habe ich für die responsive Ansicht ein On-Click-Menü eingesetzt. Die Anleitung dazu hatte ich im Internet gefunden, auch mehrere Lösungsansätze für eine korrekte Funktionalität im iphone. Im Android funktioniert es auch prima, nur im iphone anscheindend leider immer noch nicht. Ich selber nutze keines ...

Kennt von Euch jemand eine Lösung, die funktioniert ? ..... ohne JavaScript, bitte.

Die Entwicklerseite lautet http://shop2014.pielmeier24.de

Vielen Dank für die Hilfe und liebe Grüße
Seelefant
__________________
Die Gelassenheit ist eine anmutige Form des Selbstbewußtseins.
Marie von Ebner-Eschenbach

Geändert von seelefant (05.01.2015 um 10:35 Uhr)
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 05.01.2015, 12:57
Benutzerbild von protonenbeschleuniger
Verbesserer
XHTMLforum-Kenner
 
Registriert seit: 06.09.2007
Beiträge: 4.977
protonenbeschleuniger ist ein wunderbarer Anblickprotonenbeschleuniger ist ein wunderbarer Anblickprotonenbeschleuniger ist ein wunderbarer Anblickprotonenbeschleuniger ist ein wunderbarer Anblickprotonenbeschleuniger ist ein wunderbarer Anblickprotonenbeschleuniger ist ein wunderbarer Anblickprotonenbeschleuniger ist ein wunderbarer Anblick
Standard

Auch im firefox sehe ich kein Menü. Evtl. liegt es an den Fehlern im CSS W3C CSS Validator results for http://shop2014.pielmeier24.de/ (CSS level 3) - auch die Konsole des Browsers ist voller Warnungen.
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 05.01.2015, 13:03
Benutzerbild von seelefant
Erfahrener Benutzer
XHTMLforum-Mitglied
Thread-Ersteller
 
Registriert seit: 29.01.2006
Ort: im Steirischen Salzkammergut
Beiträge: 260
seelefant wird schon bald berühmt werden
Standard

Das Click-On-Menü erscheint erst ab 850px Bildschirmbreite. Davor ist die ganz normale Navigation zu sehen. Bei mir zumindest.

Ich schaue mir die Warnung alle mal an, aber daran kann es eigentlich nicht liegen, da im Android ja alles so funktioniert, wie es soll. Auch, beim Verkleinern der Bildschirmgröße im Firefox ...

Danke!
__________________
Die Gelassenheit ist eine anmutige Form des Selbstbewußtseins.
Marie von Ebner-Eschenbach
Mit Zitat antworten
  #4 (permalink)  
Alt 05.01.2015, 13:31
Benutzerbild von protonenbeschleuniger
Verbesserer
XHTMLforum-Kenner
 
Registriert seit: 06.09.2007
Beiträge: 4.977
protonenbeschleuniger ist ein wunderbarer Anblickprotonenbeschleuniger ist ein wunderbarer Anblickprotonenbeschleuniger ist ein wunderbarer Anblickprotonenbeschleuniger ist ein wunderbarer Anblickprotonenbeschleuniger ist ein wunderbarer Anblickprotonenbeschleuniger ist ein wunderbarer Anblickprotonenbeschleuniger ist ein wunderbarer Anblick
Standard

Zitat:
Zitat von seelefant Beitrag anzeigen
Das Click-On-Menü erscheint erst ab 850px Bildschirmbreite. Davor ist die ganz normale Navigation zu sehen. Bei mir zumindest.
Ja und? Du kannst bei den meisten üblichen Oberflächen die Fenstergröße der Anwendungen ändern. Und wenn ich das Fenster schmaler mache, sehe ich keine funktionierendes Menü.

Zitat:
Zitat von seelefant Beitrag anzeigen
Ich schaue mir die Warnung alle mal an, aber daran kann es eigentlich nicht liegen, da im Android ja alles so funktioniert, wie es soll. Auch, beim Verkleinern der Bildschirmgröße im Firefox ...
Bei mir nicht, was soll denn da passieren?
Dann hast du ja unzählige Bedingungen in dem CSS die nur für bestimmte Browser oder Fenstergrössen wirken sollen und da scheinen viele Fehler enthalten zu sein. Insonfern ist deine Aussage nicht nachvollziehbar, denn natürlich erklärt sich ein Unterschied in der Darstellung aus genau solchen Fehlern.
Mit Zitat antworten
  #5 (permalink)  
Alt 05.01.2015, 13:31
Benutzerbild von protonenbeschleuniger
Verbesserer
XHTMLforum-Kenner
 
Registriert seit: 06.09.2007
Beiträge: 4.977
protonenbeschleuniger ist ein wunderbarer Anblickprotonenbeschleuniger ist ein wunderbarer Anblickprotonenbeschleuniger ist ein wunderbarer Anblickprotonenbeschleuniger ist ein wunderbarer Anblickprotonenbeschleuniger ist ein wunderbarer Anblickprotonenbeschleuniger ist ein wunderbarer Anblickprotonenbeschleuniger ist ein wunderbarer Anblick
Standard

Oder funktioniert das Menü nur mit aktivierten JS?
Mit Zitat antworten
  #6 (permalink)  
Alt 05.01.2015, 14:20
Benutzerbild von seelefant
Erfahrener Benutzer
XHTMLforum-Mitglied
Thread-Ersteller
 
Registriert seit: 29.01.2006
Ort: im Steirischen Salzkammergut
Beiträge: 260
seelefant wird schon bald berühmt werden
Standard

Eigentlich nicht, es soll ja gerade ohne js laufen. Hmmm, ich versteh' das nicht ganz, warum es bei mir klappt und auch in Smartphones und Tablets.

Gut, im Beispiel stand drin, dass es im iphone nicht funktioniert .... Aber wenn es bei Dir nicht mal im Firefox tut .... Bin grad ratlos. Bei mir zeigt es artig ein Shopnavi ein- / ausschalten und bei Klick oder Fingertipp im Smartphone klappt das Menü brav aus, bzw. wieder ein ....

Ich muss die Fehlermeldungen mal in Ruhe anschauen.
__________________
Die Gelassenheit ist eine anmutige Form des Selbstbewußtseins.
Marie von Ebner-Eschenbach
Mit Zitat antworten
  #7 (permalink)  
Alt 05.01.2015, 16:07
Erfahrener Benutzer
XHTMLforum-Mitglied
 
Registriert seit: 02.01.2012
Beiträge: 487
dazzle89 wird schon bald berühmt werden
Standard

Bei mir funktioniert das Dropdown-Menü in gar keinem Browser.

Könntest du mal den Teil des CSS-Codes posten, der deiner Meinung nach für das Ausklappen das Menüs zuständig ist?

Ich konnte nur herausfinden, dass du es per opacity: 0 und visibility: hidden ausblendest, ich konnte aber nichts finden, wo du es per Hover wieder einblendest, also opacity auf 1 setzt usw.
Mit Zitat antworten
  #8 (permalink)  
Alt 05.01.2015, 17:00
Benutzerbild von seelefant
Erfahrener Benutzer
XHTMLforum-Mitglied
Thread-Ersteller
 
Registriert seit: 29.01.2006
Ort: im Steirischen Salzkammergut
Beiträge: 260
seelefant wird schon bald berühmt werden
Standard

Das ist das zuständige CSS:

Code:
#navi {
	float: left;
	width: 100%;
	background-color: #00407e;  
	}
.onclick-menu {
    position: relative;
    display: inline-block;
	color: #ffffff;
	text-align: center;
	width: 100%;
	background-color: #00407e; 
	}
.onclick-menu:before {
    content: "Navigation an/aus";
	font-size: 1.5em;
	background-color: #00407e; 
	}
.onclick-menu:focus .onclick-menu-content,
.onclick-menu:hover .onclick-menu-content,
.onclick-menu:active.onclick-menu-content {
    /* content is visible if menu is 'opened' */
    visibility: visible;
    /*  opacity is 1 in opened state (see below) */
    opacity: 1;
	display: block;
    visibility: visible;
    /* don't let pointer-events affect descendant elements */
    pointer-events: auto;	
	}
	
.onclick-menu:after {
    visibility: hidden;
	}
.onclick-menu-content {
    position: absolute;
    z-index: 1;
	/* use opacity to fake immediate toggle */
    opacity: 0;
    /* disable visibility by default, delay to enable clicks */
    visibility: hidden;
    transition: visibility 0.5s;
	background-color: ##00407e; 
	}

.onclick-menu:focus,
.onclick-menu:hover,
.onclick-menu:active {
    /* clicking on label should toggle the menu */
    pointer-events: none;
	}
__________________
Die Gelassenheit ist eine anmutige Form des Selbstbewußtseins.
Marie von Ebner-Eschenbach
Mit Zitat antworten
  #9 (permalink)  
Alt 05.01.2015, 17:09
Erfahrener Benutzer
XHTMLforum-Mitglied
 
Registriert seit: 02.01.2012
Beiträge: 487
dazzle89 wird schon bald berühmt werden
Standard

Also mein Browser zeigt diesen Bereich gar nicht an:

Code:
.onclick-menu:focus .onclick-menu-content,
.onclick-menu:hover .onclick-menu-content,
.onclick-menu:active.onclick-menu-content {
    /* content is visible if menu is 'opened' */
    visibility: visible;
    /*  opacity is 1 in opened state (see below) */
    opacity: 1;
	display: block;
    visibility: visible;
    /* don't let pointer-events affect descendant elements */
    pointer-events: auto;	
	}
Und genau den benötigst du. Der restliche von dir genannte Code dagegen wird geladen. Das könnte mit deinen Media Querys zusammenhängen. In welcher CSS-Datei soll sich der Code denn befinden?
Mit Zitat antworten
Sponsored Links
  #10 (permalink)  
Alt 05.01.2015, 19:24
Benutzerbild von seelefant
Erfahrener Benutzer
XHTMLforum-Mitglied
Thread-Ersteller
 
Registriert seit: 29.01.2006
Ort: im Steirischen Salzkammergut
Beiträge: 260
seelefant wird schon bald berühmt werden
Standard

Danke für den Hinweis, das hilft mir fürs Erste weiter. Ich musste ein Feedback-Tool einbauen und habe anschließend nicht mehr geprüft, ob das Onclick-Menü weiterhin funktioniert. Ich werde hier nochmal testen und schauen. Tatsächlich läuft es bei mir auch nicht mehr

Danke!
__________________
Die Gelassenheit ist eine anmutige Form des Selbstbewußtseins.
Marie von Ebner-Eschenbach
Mit Zitat antworten
Sponsored Links
Antwort

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
div container on click vergrössern keira CSS 3 14.09.2017 21:59
Langsames Scrollen bei Click prinzvalium CSS 8 04.04.2014 17:13
jQuery click() für div's zum ändern der Hintergrundfarbe MarioSN Javascript & Ajax 9 09.09.2011 20:16
Jquery Click auf DIV MrFreeze Javascript & Ajax 2 21.06.2011 09:03
Divs bei click auswechseln Ben. Javascript & Ajax 5 17.04.2011 12:45


Alle Zeitangaben in WEZ +2. Es ist jetzt 10:47 Uhr.