Bildgenerator?
Gibt es eine Möglichkeit eine Art Generator zu erstellen?
Meine Vorstellung sieht so aus:
Oben wählt meine die Farbe aus und unten sieht man dann das Bild mit der entsprechenden Farbe.
Das könnten einfache Bilder sein die sich je nach geklickter Farbe wechseln. 
Habs selber hinbekommen. 
...das klingt seehr interessant! wie hast Du es gemacht? gibt es eine Demo?
LG, az
Achtung: Code im Forum bitte am besten mit der Schaltfläche für "Code" einkapseln!!! (= 
) , oder den Code in Formatierungs-Klammern setzen (...zwischen "code" und "/code", jeweils in eckigen Klammern).
Achtung! Im neuen Layout ist die Formatierungsleiste versteckt! Klick auf das Smiley rechts oben über dem Text-Editorfenster, um die Formatierungssymbole einzublenden!
...und zuletzt: Bitte sendet mir keine privaten Nachrichten über das Forum! Bitte Nachrichten an mich nur per e-mail oder über das Kontaktformular auf meiner Webseite https://redesign-berlin.de
Wenn Ihr mich sucht, hier findet Ihr mich:
https://www.facebook.com/redesign.berlin
https://redesign-berlin.de
mailto:info@redesign-berlin.de
Spenden: Hier könnt Ihr unser Userforum finanziell unterstützen: page-644478-1.html
sehr geil, die Idee! Was man alles mit Jimdo-Bordmitteln machen kann!
Ich hab einmal eine JS-Lösung gefunden, die ich auch ganz schick finde. Mit der kannst Du dem #div des Bildes einfach onclick eine neue HG-Farbe oder sogar einen Gradienten-Verlauf zuweisen:
http://forum-images.jimdo.com/forum/gradient-background/
Die Gradienten erzwuge ich hiermit: http://www.colorzilla.com/gradient-editor/
LG, az
Achtung: Code im Forum bitte am besten mit der Schaltfläche für "Code" einkapseln!!! (= ) , oder den Code in Formatierungs-Klammern setzen (...zwischen "code" und "/code", jeweils in eckigen Klammern).
Achtung! Im neuen Layout ist die Formatierungsleiste versteckt! Klick auf das Smiley rechts oben über dem Text-Editorfenster, um die Formatierungssymbole einzublenden!
...und zuletzt: Bitte sendet mir keine privaten Nachrichten über das Forum! Bitte Nachrichten an mich nur per e-mail oder über das Kontaktformular auf meiner Webseite https://redesign-berlin.de
Wenn Ihr mich sucht, hier findet Ihr mich:
https://www.facebook.com/redesign.berlin
https://redesign-berlin.de
mailto:info@redesign-berlin.de
Spenden: Hier könnt Ihr unser Userforum finanziell unterstützen: page-644478-1.html
Das ist ja 1000x besser als meine Variante.
2 Fragen dazu:
Wie geht das? 
Geht es auch die Bilder an sich zu wechseln?
Die richtigen Bilder werden für jede Farbe neu in 3D gerendert.
...in 3d gerendert! Supercool! wenn du mir verraten würdest, wie das geht? CAD?
Mein Trick ist einfach, geradezu etwas primitiv:
Das Bild ist ein PNG mit Transparenz, jedenfalls in dem Bereich, in dem der farbige Gradient zu sehen sein soll. Die Images habe ich als Galerie hochgeladen - aber nur, weil ich die Thumbnails für meine Schaltflächen benötige.
Jetzt kommt das Script ins Spiel, der Code ist wie folgt:
2
3
4
5
6
7
8
9
10
11
12
<a href="#" id="orange" onclick="orange()" name="orange"><img src="https://image.jimcdn.com/app/cms/image/transf/dimension=60x60:mode=crop:format=png/path/sbcfc830c2d85c206/image/i3a74f7e30d724cec/version/1461071257/image.png" data-orig-width="1040" data-orig-height="612" alt=""></a> <script type="text/javascript">
//<![CDATA[
function orange() {
/* calling body append will add your new styles to the bottom of the page and override any existing ones */
$('head').append('<style type="text/css">img#cc-m-imagesubtitle-image-13413682424 {background: -moz-linear-gradient(-45deg, rgba(250,113,8,0.65) 0%, rgba(0,0,0,0) 100%); /* FF3.6-15 */background: -webkit-linear-gradient(-45deg, rgba(250,113,8,0.65) 0%,rgba(0,0,0,0) 100%); /* Chrome10-25,Safari5.1-6 */background: linear-gradient(35deg, rgba(250,113,8,0.65) 0%,rgba(0,0,0,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */<\/style>');
}
//]]>
</script>
- https://image.jimcdn.com... ist das Thumbnail-Bild, welches mit als Schaltfläche dient
- alles, was zwischen .append('...') steht, wird unten an Dein CSS-Script im Head angefügt
- img#cc-m-imagesubtitle-image-13413682424 ist der CSS-Bezeichner für das png-Bild, welches ich einfach als Bild-Element hoch geladen habe
- und background: -moz-linear-gradient... ist der Gradient, den ich mit Hilfe des Generators auf http://www.colorzilla.com/gradient-editor/ erzwugt hab :)
Das Gleiche Schema für die anderen SF und alles in ein Spaltenelement mit 2 Spalten - fertig!
LG, az
PS: noch eleganter geht es, wenn Du die Gradienten im CSS als "ungenutzte" Klassen anlegst und diese dem #div per JQuery zuweist...
Achtung: Code im Forum bitte am besten mit der Schaltfläche für "Code" einkapseln!!! (= ) , oder den Code in Formatierungs-Klammern setzen (...zwischen "code" und "/code", jeweils in eckigen Klammern).
Achtung! Im neuen Layout ist die Formatierungsleiste versteckt! Klick auf das Smiley rechts oben über dem Text-Editorfenster, um die Formatierungssymbole einzublenden!
...und zuletzt: Bitte sendet mir keine privaten Nachrichten über das Forum! Bitte Nachrichten an mich nur per e-mail oder über das Kontaktformular auf meiner Webseite https://redesign-berlin.de
Wenn Ihr mich sucht, hier findet Ihr mich:
https://www.facebook.com/redesign.berlin
https://redesign-berlin.de
mailto:info@redesign-berlin.de
Spenden: Hier könnt Ihr unser Userforum finanziell unterstützen: page-644478-1.html
...ich hab Deinen Code mal korrigiert. Probier mal, ob er so funzt! Hoffe ich hab nix übersehen :)
Achtung: Code im Forum bitte am besten mit der Schaltfläche für "Code" einkapseln!!! (= ) , oder den Code in Formatierungs-Klammern setzen (...zwischen "code" und "/code", jeweils in eckigen Klammern).
Achtung! Im neuen Layout ist die Formatierungsleiste versteckt! Klick auf das Smiley rechts oben über dem Text-Editorfenster, um die Formatierungssymbole einzublenden!
...und zuletzt: Bitte sendet mir keine privaten Nachrichten über das Forum! Bitte Nachrichten an mich nur per e-mail oder über das Kontaktformular auf meiner Webseite https://redesign-berlin.de
Wenn Ihr mich sucht, hier findet Ihr mich:
https://www.facebook.com/redesign.berlin
https://redesign-berlin.de
mailto:info@redesign-berlin.de
Spenden: Hier könnt Ihr unser Userforum finanziell unterstützen: page-644478-1.html
ich finde den Fehler nicht. Hab deshalb Deinen Code oben noch einmal verändert. Probier mal, ob der geht - sonst schick mir mal das login, wenn du willst...
LG, az
Achtung: Code im Forum bitte am besten mit der Schaltfläche für "Code" einkapseln!!! (= ) , oder den Code in Formatierungs-Klammern setzen (...zwischen "code" und "/code", jeweils in eckigen Klammern).
Achtung! Im neuen Layout ist die Formatierungsleiste versteckt! Klick auf das Smiley rechts oben über dem Text-Editorfenster, um die Formatierungssymbole einzublenden!
...und zuletzt: Bitte sendet mir keine privaten Nachrichten über das Forum! Bitte Nachrichten an mich nur per e-mail oder über das Kontaktformular auf meiner Webseite https://redesign-berlin.de
Wenn Ihr mich sucht, hier findet Ihr mich:
https://www.facebook.com/redesign.berlin
https://redesign-berlin.de
mailto:info@redesign-berlin.de
Spenden: Hier könnt Ihr unser Userforum finanziell unterstützen: page-644478-1.html
Jetzt anmelden!
Jetzt registrieren!
