Der lustige Lichtschalter

  • Seite 5 von 7
28.11.2013 08:39 (zuletzt bearbeitet: 28.11.2013 08:39)
avatar  Alice ( gelöscht )
#61 RE: RE:Der lustige Lichtschalter
Al
Alice ( gelöscht )

Ich hab grad rausgefunden wie man ein vierseitiges Thema komplett mit allen Beiträgen umbenennen kann und nur ein paar Klicks nutzen muss.
So blöde wie einfach. (Zumindest ich wusste es noch nicht).

Das schreibe ich gleich mal ins Kennst du schon....? für heute


 Antworten

 Beitrag melden
28.11.2013 08:59
avatar  Romulus
#62 RE: RE:Der lustige Lichtschalter
avatar
Mitglied

Also ich komme da jetzt nicht dahinter, welchen Trick Du da gefunden haben könntest. Ich bin mir aber ziemlich sicher, dass Dir die Idee zwischen Post #41 und #44 gekommen sein muss. Stimmts? Denn an dieser Stelle ist mir gestern auch ein kurzer Geistesblitz gekommen. Aber der Blitz war einfach zu schnell gewesen, und weg war er wieder.

Nun bin ich wirklich sehr gespannt!

www.neverface.com
Liebhaber des Business Templates

 Antworten

 Beitrag melden
28.11.2013 09:08
avatar  Alice ( gelöscht )
#63 RE: RE:Der lustige Lichtschalter
Al
Alice ( gelöscht )

Zwischen welchen Postings weiß ich gar nicht mehr, auf jeden Fall aber beim Lesen. Allerdings nicht wegen dem hier geschriebenen, sondern weil ich neulich etwas ähnliches machte. *g*

Ich reproduziere es in einem Testforum und mache Screenshots für den Artikel.


 Antworten

 Beitrag melden
28.11.2013 10:05
#64 RE: RE:Der lustige Lichtschalter
avatar
Mitglied

Moin Romulus,
wie man die Position festtackert und auch die Größe des Bildes verändern kann,
habe ich durch ausprobieren gefunden.
Aber Danke für deine Codes.
Das mit der Transparenz werde ich mal in Ruhe testen.
Denn die Idee macht sogar einen Sinn :-)

Trotzdem spiele ich noch ein wenig weiter.
Also den Bereich verändern der abgedeckt wird. - Z.B. nur die untere oder rechte Hälfte des Bildschirms etc.
Oder mit Hintergrundbilder experimentieren.
So kann man den Button ab und zu bei Bedarf aktivieren und mit einem Bild füllen auf dem z.B. ein "Spruch" des Tages" zu lesen ist.
Wenn er dauerhaft da wäre, würde ihn irgendwann niemand mehr beachten.

Nun fehlt mir nur noch die Möglichkeit einen wechselnden Tooltip einzubauen.
Ich suche schon im Netz.
Aber entweder funktionieren die Lösungen nicht so wie ich es brauche oder ich verstehe sie einfach nicht ;-)

Gruß
Frank


Boardnr. 621181

www.aquariumzimmer.de
Boardnr. 572886
Business Template

 Antworten

 Beitrag melden
28.11.2013 10:12
#65 RE: RE:Der lustige Lichtschalter
avatar
Mitglied

Guten Morgen .Kollegen

Hab gesehen ,dass ihr heute schon sehr früh ins Thema eingestiegen seit. Haha, Nachdem Frühstück geht's gleich weiter. Schön euch so munter zu sehen . Und Alice war auch schon fleißig *lob*

**********************************
Ich frage nach ,damit ich was lerne

 Antworten

 Beitrag melden
28.11.2013 10:44
avatar  .BiL.
#66 RE: RE:Der lustige Lichtschalter
avatar
Mitglied

Tolle Sache!

Wie hieß denn das Thema gestern? Ich habe es nicht wahrgenommen - was doch ein guter Titel ausmacht ...

Ich muss mich schwer beherrschen, mich nicht von meinen letzten Bastelarbeiten am Adventskalender ablenken zu lassen ... vielleicht baue ich ihn auch noch dort irgendwo ein. Mal schauen ...

.
Viele Grüße .BiL.
Friends of Xobor

Fragen zu Plugins und Pluginideen bitte nicht per PN, sondern öffentlich oder im FoXum stellen.

 Antworten

 Beitrag melden
28.11.2013 10:48
avatar  TripleM
#67 RE: RE:Der lustige Lichtschalter
avatar
Mitglied

Gestern hieß der Titel "Vorschlag" was eben nicht sehr aussagekräftig war.


 Antworten

 Beitrag melden
28.11.2013 10:58
#68 RE: RE:Der lustige Lichtschalter
avatar
Mitglied

Ich habe nun mt der Deckkraft aus Romulus Skript gespielt.
Das funzt gut.
Eines verstehe ich aber nicht.
Wenn ich die HTML-, Head- und Body-Tags weglasse,
passiert bei mir gar nichts.
Hab sie also wieder rein gesetzt.
Damit geht es.
So sieht der Code nun in meinem Testforum (http://meerwasserverein-taucherforum.xobor.de/)aus.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
 
<html>
<head>
<script>
function toggleLicht(){
switchoff = document.getElementById("switch-off");
if(switchoff.style.display == "none")
switchoff.style.display = "block";
else
switchoff.style.display = "none";
}
</script>
<style>
#switch-off {
background: #000000 !important;
opacity: .7;
filter: alpha(opacity=50);
-moz-opacity: .9;
height: 80%;
left: 10%;
position: fixed;
top: 10%;
width: 80%;
z-index: 10000;
display: none;
}
#switch {
position: fixed;
left: 5px;
top: 520px;
z-index: 20000;
}
</style>
</head>
<body>
<div style="display:none;" id="switch-off"></div>
<div id="switch">
<a onClick="toggleLicht()" href="#"><img src="http://www.ins-netz-gehen.de/sites/all/themes/zen_bzga/images/elements/lichtschalter.png" width="50%"></a>
</div>
</body>
</html>
 



Damit habe ich nun einen dunklen Kasten mit leichter Transparenz,
Der aber nicht den ganzen Bildschirm verdeckt.

Wenn ich da nun auch noch Text rein setzten könnte, wäre das super.

Gruß
Frank


Boardnr. 621181

www.aquariumzimmer.de
Boardnr. 572886
Business Template

 Antworten

 Beitrag melden
28.11.2013 11:26
#69 RE: RE:Der lustige Lichtschalter
avatar
Mitglied

Einen wunderschönen guten Morgen,

was auch so ein kleiner Lichtschalter ausmacht gestern fanden wir kaum ins Bett und heute sind wir schon wieder da

Frage @ Frank, also was tut das jetzt bei Dir, ist das jetzt, dass man da ein Fenster einblenden könnte, z. B. die wichtigen Forennachrichten? Oder bei uns z. B. die perle der Woche? Also sowas ähnliches, wie Xobor hier das mit dem Scheefall an und abschalten gemacht hat gut wäre, wenn man den Schalter mit einem Tooltipp versehen könnte. Uebrigens, mit den Klammern funzt dan der Link zu Deinem Testforum nicht = Not Found.

Mit freundlichen Grüssen
Gabriella

http://www.musengarten.com/
http://www.garten-der-poesie.de/

Layout: Business

 Antworten

 Beitrag melden
28.11.2013 11:55
#70 RE: RE:Der lustige Lichtschalter
avatar
Mitglied

Hi Shogun.
Uups,
hätte wohl auf Leerzeichen bei den Klammern achten müssen ;-)
http://meerwasserverein-taucherforum.xobor.de/
Der Button ist links mittig zu finden.

Es erscheint halt ein dunkles Fenster.
Sieht so ähnlich aus wie wenn Bilder als Diashow gezeigt werden.
Dann ist der Hintergrund ja auch transparent abgedunkelt.

Zitat
z. B. die wichtigen Forennachrichten? Oder bei uns z. B. die perle der Woche? Also sowas ähnliches, wie Xobor hier das mit dem Scheefall an und abschalten gemacht hat gut wäre, wenn man den Schalter mit einem Tooltipp versehen könnte.


Ja, so etwas ähnliches schwirrt mir im Kopf rum.
Ich weiß nur nicht wie ich die Fläche mit Text befüllen kann.
Hab schon einige Befehle innerhalb des Codes ausprobiert.
Aber hat hat der Button dann nichts mehr gemacht.
Ich müsste entweder die Fläche bei Aktivierung füllen
oder ständig vorhandenen Text unsichtbar erstellen und erst mit dem Kasten zusammen sichtbar machen.
Aber ich weiß halt nicht einmal wie ich Text aus der Fläche einblenden kann.

Gruß
Frank


Boardnr. 621181

www.aquariumzimmer.de
Boardnr. 572886
Business Template

 Antworten

 Beitrag melden
28.11.2013 12:13 (zuletzt bearbeitet: 28.11.2013 12:14)
avatar  TripleM
#71 RE: RE:Der lustige Lichtschalter
avatar
Mitglied

Man könnte ein zweites Bild mit einbinden in dem eben nur Text zu sehen ist. In meinen Beispiel Weißer Untergrund schwarze schrift. Sollte natürlich auch anders herum gehen. Und dann das Bild 2 an die Größe des Transparenten Schwarz anpassen.

http://ig-offroadbagaluten.xobor.de/

Da kann man es sehen der Button ist Linksseitig unten.



Aber es gibt sicher noch eine andere Lösung mit Text. Muß nur der Richtige kommen der weiß wie.


 Antworten

 Beitrag melden
28.11.2013 12:27
#72 RE: RE:Der lustige Lichtschalter
avatar
Mitglied

Hi Mario,
das mit dem Bild ist noch ne weitere Variante mit der man viel spielen kann.
Gab es hier schonmal ein Beispiel für so eine Zeile?
Ich wüsste nämlich grad nicht wo ich sie einsetzen müsste oder ob etwas ersezt werden müsste.
So ganz verstehe ich den Code nämlich noch nicht.
Hab versucht an einigen Stellen DIV´s einzusetzen.
Egal wo und wie, es war immer ein Fehlschlag.

Gruß
Frank


Boardnr. 621181

www.aquariumzimmer.de
Boardnr. 572886
Business Template

 Antworten

 Beitrag melden
28.11.2013 12:31 (zuletzt bearbeitet: 28.11.2013 12:33)
avatar  TripleM
#73 RE: RE:Der lustige Lichtschalter
avatar
Mitglied

Für ein weiteres Bild habe ich das so eingebaut wie bei dir mit leichter änderung.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
 
<html>
<head>
<script>
function toggleLicht(){
switchoff = document.getElementById("switch-off");
if(switchoff.style.display == "none")
switchoff.style.display = "block";
else
switchoff.style.display = "none";
}
</script>
<style>
#switch-off {
background: #000000; background-image:url(http://up.picr.de/16595219lr.png); background-repeat:No-repeat; background-position:center; !important;
opacity: .7;
filter: alpha(opacity=50);
-moz-opacity: .9;
height: 80%;
left: 10%;
position: fixed;
top: 10%;
width: 80%;
z-index: 10000;
display: none;
}
#switch {
position: fixed;
left: 5px;
top: 520px;
z-index: 20000;
}
</style>
</head>
<body>
<div style="display:none;" id="switch-off"></div>
<div id="switch">
<a onClick="toggleLicht()" href="#"><img src="http://www.ins-netz-gehen.de/sites/all/themes/zen_bzga/images/elements/lichtschalter.png" width="50%"></a>
</div>
</body>
</html>
 



Veränderung siehe Zeile 14.


 Antworten

 Beitrag melden
28.11.2013 12:34
#74 RE: RE:Der lustige Lichtschalter
avatar
Mitglied

Vielen Dank.
Habs gerade über deien Seitenquelltext gefunden.
Funzt super.
Ich versuche an der Stelle mal weiter zu experimentieren.

Gruß
Frank


Boardnr. 621181

www.aquariumzimmer.de
Boardnr. 572886
Business Template

 Antworten

 Beitrag melden
28.11.2013 14:13
#75 RE: RE:Der lustige Lichtschalter
avatar
Mitglied

Hi Leute,
mit den hier angebotenen Änderungen, Recherchen im Netz,
einer Textein- und ausblendung auf anderer Basis,
habe ich es tatsächlich geschaft eine funktionierende Kombination aus dunklem Hintergrund,
darüber liegendem Bild und Text zu erschaffen.

Ich gebe zu, bei weitem nicht alles verstanden zu haben was ich da gemacht habe.
Aber zumindest weiß ich nun mit dieser Vorlage zu arbeiten.

Es wäre schön wenn jemand den Code noch ein wenig auf Fehler,
Unschönheiten, bessere Struktur etc. kontrollieren könnte
Kommentare an einzelnen Stellen wären auch nicht schlecht.

Für alle,
die selber einige Ideen umsetzen möchten,
hier mal mein nicht perfektes Ergebnis:
http://meerwasserverein-taucherforum.xobor.de/

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
 
<html>
<head>
<script>
function toggleLicht(){
Nachrichtoff = document.getElementById("Nachricht");
if(Nachricht.style.display == "none")
Nachricht.style.display = "block";
else
Nachricht.style.display = "none"
switchoff = document.getElementById("switch-off");
if(switchoff.style.display == "none")
switchoff.style.display = "block";
else
switchoff.style.display = "none";
}
</script>
<style>
#switch-off {
background: #000000; background-image:url(http://up.picr.de/16595219lr.png); background-repeat:No-repeat; background-position:center; !important;
opacity: .7;
filter: alpha(opacity=50);
-moz-opacity: .9;
height: 80%;
left: 10%;
position: fixed;
top: 10%;
width: 80%;
z-index: 10000;
display: none;
}
#switch {
position: fixed;
left: 5px;
top: 520px;
z-index: 20000;
}#spoiler {display: none;};
</style>
</head>
<body>
<div style="display:none;" id="switch-off"></div>
<div id="switch">
<a onClick="toggleLicht()" href="#"><img src="http://www.ins-netz-gehen.de/sites/all/themes/zen_bzga/images/elements/lichtschalter.png" width="50%"></a>
</div>
<div style="display:none; left: 20%;position: fixed;top: 10%; z-index: 10001;color:#FF0000;font-size:200%" id="Nachricht">
<p>Dies hier ist nur ein Beispieltext<br/>
Der Code ist auch noch nicht auskommentiert!<br/>
Und verstanden hab ich auch nur die Hälfte ;-)</p>
</div>
</body>
</html>
 

Gruß
Frank


Boardnr. 621181

www.aquariumzimmer.de
Boardnr. 572886
Business Template

 Antworten

 Beitrag melden
Bereits Mitglied?
Jetzt anmelden!
Mitglied werden?
Jetzt registrieren!