HTML |JS Geisterelemente?

[Rain]

Hallo zusammen,

ich bin ziemlich sicher, dass meine folgende Frage mit nein beantwortet wird, aber vielleicht gibt es soetwas ja doch.

Ich habe momentan ein neues Projekt, welches ich parallel neben der Desktopversion fürs iPad entwickle. Die "iPad-Änderungen" sollen dabei so gering wie möglich sein, bis auf die notwendigen Anpassungen.

Im Contentbereich kann die entsprechende Box vertical länger sein als der momentane Anzeigebereich, also muss mit dem Finger gewischt werden um zu scrollen. Um den Benutzer deutlich zu machen, dass die Box länger ist, schwebte mir ein Pfeil am unteren Rand vor.

Jetzt meine Frage:

Der Pfeil soll sich immer an der gleichen Stelle befinden und im schlimmsten Fall wird Inhalt von ihm überdeckt (Inputs, Text, etc). Gibt es eine Möglichkeit HTML-Elementen (eventuell per JS/jQuery) ein Verhalten beizubringen, dass sie immer an oberster Ebene (z-index) zu sehen sind, aber mit darunter liegendem Inhalt weiterhin agiert werden kann, als eine Art "Geistelement". Sry für den blöden Ausdruck, ich weiß nicht so wirklich wie ich es deutlich beschreiben soll bzw. was günstige Schlagwörter für ne Google-Suche sind, "Html geistelement" jedenfalls schonmal nicht
Normalerweise sind Text, Inputs, etc. unterhalb von Elementen ja nicht mehr agierbar. Aber vielleicht weiß ja jemand was.

Der Pfeil wäre in meinen Fall mit einer hohen Transparenz als .png

Grüße, Rain

 

[character]

Da das geht sogar ohne JS nur mit CSS. "pointer-events: none" ist was du suchst. Dadurch kann man durch das Element "durchklicken". Funktioniert in Gecko und WebKit und somit vermutlich auch auf dem iPad (wenn da Safari verwendet wird).

 

[Madman1209]

Hi,

abgesehen vom Problem: Ist das eine Web-Anwendung? PHP / JavaScript? Falls ja, in welchem Framework wird gearbeitet? Kann da Sencha empfehlen, habe eine Anwendung geschrieben, sieht auf Android Phone, Tablet, iPad und in Chrome absolut wunderbar aus - ohne irgendwelche Anpassungen (ausser "automatisches Drehen bei Mobilgeräten deaktiviert").

Was mir zum Problem einfällt: Wenn es eine SVG-Grafik ist kannst du mit 'pointer-events="none"' durch ein Element durchklicken. Bin mir jetzt aber weder sicher, ob das nicht schon deprecated ist oder ob es dir was nützt.

Liest sich so wie deine Anforderung: Beispiel

VG,
Mad

 

[Rain]

Danke euch beiden, das CSS Attribut hats gebracht, funktioniert in Firefox und iPad/Safari perfekt! Jetzt muss nur noch mein Chef die Lösung schön finden

@Madman1209:

Ja, es ist eine PHP-Javascript(jQuery) Anwendung. Ich benutze kein Framework, meine einzigen Hilfsmittel zur Erstellung sind Notepad++ & Firebug.
Auch wenns unprofessionel wirkt, aber ich schreib (wie schon seit 3 1/2) Jahren alles selber und konnte auch jedes Problem bis jetzt lösen.
Auch wenns Off-Topic wird, aber ich nutze gleich mal die Gelegenheit: Was für einen Vorteil verschafft mir so ein Framework denn? Ich vermute mal es gewährleistet mir die Kompatibilität zu verschiedenen Endgeräten und vereinfacht bzw. erweitert Syntax.
Ich habe bis jetzt noch nicht wirklich Zeit und das Bedürfnis gehabt (und auch keine Notwendigkeit gesehen), mich in die Thematik Frameworks (Zend, usw) einzulesen, deswegen entschuldigt bitte die doofe Frage.

 

[Madman1209]

Hi,

Auch wenns Off-Topic wird

Naja, wenn du als TE frägst sind wir ja in deinem Topic

Was für einen Vorteil verschafft mir so ein Framework denn? Ich vermute mal es gewährleistet mir die Kompatibilität zu verschiedenen Endgeräten und vereinfacht bzw. erweitert Syntax.

Du hast eine riesige Bibliothek an vorgefertigten Elementen (Combobox, Datagrid etc) die alle schon ein immenses Repertoire an Methoden und Events haben. Schau dir mal in einem Webkitbrowser die Sencha Touch Demos an. Und dann den dazugehörigen Code.

Unheimlich wenig, klar strukturierter Code, riesige Funktionalität, erprobt und optimiert und genial zu nutzen.

deswegen entschuldigt bitte die doofe Frage.

Gibt's doch gar nicht dachte ich

VG,
Mad

 

[Rain]

Sencha ist also sowas ähnliches wie jQuery Mobile nehme ich an.

Soetwas ist praktisch, wenn man Versionen speziell für mobile Endgeräte erstellt. Mein letztes großes Projekt, in welchem ich erstmals iPad mit als Hauptanwendungsgerät berücksichtigt habe, kam allerdings auch mit (recht geringen) iPad-Anpassungen zu einem guten Ergebnis (wobei ich zugeben muss, der Quellcode ist bei mir schon sehr unübersichtlich und unstrukturiert. Bloß gut dass ich damit alleine zurecht kommen muss ^^).

Trotzdem vielen Dank für deine Infos, ich werd das Definitiv mal aufm Schirm behalten

 

[voodoo44]

Du hast eine riesige Bibliothek an vorgefertigten Elementen (Combobox, Datagrid etc) die alle schon ein immenses Repertoire an Methoden und Events haben.

Und vor allem: die ZEITERSPARNIS ...

Allein deshalb lohnt es sich schon, sich mal solch' ein Framework genauer anzusehen.
Für PHP ist Zend im übrigen sehr Nett (wenn auch ein wenig Geschmackssache) - wir setzen es in der Firma zusammen mit jQuery/jQueryMobile ein.