tinycolor

[Hannes Weninger]

Hallo,

ich verwende tinycolor als color picker. Folgende Sourcen habe ich inkludiert:

<link href="assets/bower_components/angular-color-picker/angularjs-color-picker.min.css" rel="stylesheet" />
<script type="text/javascript" src="assets/bower_components/tinycolor/tinycolor.js"></script>
<script type="text/javascript" src="assets/bower_components/angular-color-picker/angularjs-color-picker.min.js"></script>

Weiters habe ich in der Navigationsleiste ein dropdown- Menü:

<ul class="nav navbar-nav navbar-right">
	<li class="dropdown">
	    <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">
	        <span class="glyphicon glyphicon-user"></span> {{vm.user.username}} <span class="caret"></span>
	    </a>
	    <ul class="dropdown-menu" role="menu">
	        <li><a href="#" ui-sref="auth.user-profile"><translate>NAV.USERPANEL.MYPROFILE_LABEL</translate></a></li>
	        <li><a href="#" ui-sref="auth.user-settings"><translate>NAV.USERPANEL.SETTINGS_LABEL</translate></a></li>
	        <li class="divider"></li>
	        <li ng-click="vm.logout()"><a href="#"><translate>NAV.USERPANEL.LOGOUT_LABEL</translate></a></li>
	    </ul>
	</li>
</ul>

Wenn ich auf die Seite mit dem colorPicker navigiere, dann funktioniert das dropdown- Menü noch, wenn ich dann wieder zu einer anderen Seite navigiere, dann funktioniert das dropdown- menü nicht mehr. Hat jemand eine Idee was ich da machen kann, damit diese beiden Sachen gemeinsam funktionieren?

Besten Dank! Hannes

[Gunnar Bittersmann]

@@Hannes Weninger

ich verwende tinycolor als color picker.

Dass viele Browser <input type="color">   unterstützen, weißt du?

LLAP 🖖

[Hannes Weninger]

@@Hannes Weninger

ich verwende tinycolor als color picker.

Dass viele Browser <input type="color">   unterstützen, weißt du?

Wusste ich nicht, funktioniert perfekt! Du hast meinen Tag gerettet - Danke!

[Felix Riesterer]

Lieber Gunnar,

Dass viele Browser <input type="color">   unterstützen, weißt du?

nicht genügend viele - die Safari-Reihe kann es nicht. Warum Chrome das kann, Safari aber nicht, leuchtet mir nicht ein...

Liebe Grüße,

Felix Riesterer.

[Gunnar Bittersmann]

@@Felix Riesterer

Dass viele Browser <input type="color">   unterstützen, weißt du?

nicht genügend viele - die Safari-Reihe kann es nicht.

Aber doch: genügend!! Na sicher „kann man seine Zeit damit verbringen, mit den neusten und großartigsten Browsertechnologien zu experimentieren; sicher in dem Wissen, dass selbst wenn diese noch nicht weitgehend unterstützt werden, man den Fallback ja bereits hat.“ —Jeremy Keith, Responsive Enhancement (übersetzter Auszug)

Den Fallback hat man: Wenn ein Browser type="color" nicht implementiert hat, ignoriert er das type-Attribut; das Eingabefeld ist ein ganz normales Texteingabefeld.

Wenn das nicht reicht, kann man ja immer noch ein Polyfill mit JavaScript implementieren, welches aber nur von Browsern geladen wird, die type="color" nicht nativ unterstützen (feature detection).

LLAP 🖖

[Felix Riesterer]

Lieber Gunnar,

Den Fallback hat man: Wenn ein Browser type="color" nicht implementiert hat, ignoriert er das type-Attribut; das Eingabefeld ist ein ganz normales Texteingabefeld.

dann hat man zwar ein Textfeld, aber keinen Farbauswähler.

Wenn das nicht reicht, kann man ja immer noch ein Polyfill mit JavaScript implementieren, welches aber nur von Browsern geladen wird, die type="color" nicht nativ unterstützen (feature detection).

Und welches wäre das? Tinycolor? Doch nicht etwa?!

Liebe Grüße,

Felix Riesterer.

[Gunnar Bittersmann]

@@Felix Riesterer

Den Fallback hat man: Wenn ein Browser type="color" nicht implementiert hat, ignoriert er das type-Attribut; das Eingabefeld ist ein ganz normales Texteingabefeld.

dann hat man zwar ein Textfeld, aber keinen Farbauswähler.

Man kann in das Textfeld aber Farbwerte eintragen – die Grundfunktionalität ist also gegeben. Progressive enhancement hieße nicht so, wenn es nur progressive wäre. ;-)

Wenn das nicht reicht, kann man ja immer noch ein Polyfill mit JavaScript implementieren, welches aber nur von Browsern geladen wird, die type="color" nicht nativ unterstützen (feature detection).

Und welches wäre das? Tinycolor? Doch nicht etwa?!

Doch, vielleicht. Der Punkt ist, eine zusätzliche Ressourcen fressende Lösung nicht an alle auszuliefern, sondern nur an die, die das nötig hätten. Wenn Browser etwas nativ unterstützen, sollte man das natürlich verwenden.

LLAP 🖖