Chat-Aufruf über seitliches Menüfenster

21.07.2013 23:51 (zuletzt bearbeitet: 21.07.2013 23:55)
#1 Chat-Aufruf über seitliches Menüfenster
avatar
Mitglied

Mich stört,
dass das Chat-Fenster (ganz unten rechts) immer Teile vom Forum überdecken. Ich habe ein Versuch gestartet das Chat-Fenster auf der rechten Seite einzufahren zu lassen. Berührt man das Fenster, fährt es komplett heraus.

Hier: http://www.hilfe-tricks-tipps.de/

**********

Leider habe ich es noch nicht komplett hinbekommen.
Ist man abgemeldet befinden sich der notwendige Code in der unteren Leiste. Klick man nun das ausgefahrene Chat-Fenster an, bekommt man eine Aufforderung zur Anmeldung.

Code - User ist abgemeldet (Gastzugang)

1
2
3
4
5
6
7
8
9
 
<div id="xChatGuests" class="disconnected" onclick="showGuestNoChatInfo()">
<span class="xChatInfo">
<img title="disconnected" alt="disconnected" src="https://files.homepagemodules.de/b2001010/a_1233_c865a8ae.png" style="vertical-align: middle;">
<span style="margin-left:10px; font-weight:bold">{{chatname==true.start}}{{chatname}}{{chatname==true.else}}Foren-Chat{{chatname==true.end}}</span>
<span style="margin-left:10px;" class="ucspan"><img title="Mitglieder Online" alt="Mitglieder Online" src="https://files.homepagemodules.de/b2001010/a_1240_2bce5bb7.png" style="vertical-align: middle;">
<span class="ucount">{{member_online}}</span></span>
</span>
 
</div>
 



Leider habe ich noch nicht den Code für den Aufruf des Chat-Fenster im eingeloggten Zustand (Mitglied) gefunden .
Wer weiß hier weiter?

22.07.2013 09:30 (zuletzt bearbeitet: 22.07.2013 09:30)
avatar  Alice ( gelöscht )
#2 RE: Chat-Aufruf über seitliches Menüfenster
Al
Alice ( gelöscht )

Ist das ein Verbesserungsvorschlag der durch uns umgesetzt werden soll, oder kann ich es nach Fragen und Antworten verschieben?


 Antworten

 Beitrag melden
22.07.2013 22:55 (zuletzt bearbeitet: 22.07.2013 22:56)
#3 RE: Chat-Aufruf über seitliches Menüfenster
avatar
Mitglied

Kannst Du auch verschieben.
Bis dann

23.07.2013 07:43
avatar  Ingmar
#4 RE: Chat-Aufruf über seitliches Menüfenster
avatar
Technik

Das sollte sich auch ohne Template-Eingriff relativ einfach per CSS-Addon lösen lassen.

Auf die Schnelle würde ich das so probieren:

1
2
3
4
5
6
7
8
9
10
11
12
13
 

#xChat_global.disconnected{
position: fixed !important;
right: 0px;
bottom: 100px;
min-width:30px !important;
}
 

#xChat_global.disconnected .xChatInfo {display:none;}
 
#xChat_global.disconnected .xChatHead{width: 30px; overflow:hidden;}
 
 



Das kannst du dann natürlich beliebig anpassen.

Viele Grüße,
Ingmar


 Technik · Homepagemodules.de · Miranus GmbH

 Antworten

 Beitrag melden
28.07.2013 19:41 (zuletzt bearbeitet: 28.07.2013 19:44)
#5 RE: Chat-Aufruf über seitliches Menüfenster
avatar
Mitglied

Hallo Ingmar,
ich habe alles ausprobiert, komme einfach nicht weiter!

Eigendlich müsste schon "#xChat_global.disconnected .xChatInfo {display:none;}" das kleine Chat-Fenster ausblenden. Tut es aber nicht.

Ich habe mit "!important" einiges probiert, geht leider auch nicht.

Was kann ich machen, wo liegt der Fehler?
Oder liegt das am Standard-Template?

29.07.2013 19:53
avatar  Olaf
#6 RE: Chat-Aufruf über seitliches Menüfenster
Ol
Mitglied

Ich hätte da auch noch einen Vorschlag,ohne die Template zu verändern:

1
2
3
4
5
6
7
8
 
#xChat_global.disconnected, #xChatGuests {
max-width: 10px;
min-width: 0px ! important;
}
 
#xChat_global.disconnected:hover, #xChatGuests.disconnected:hover {
max-width: 300px;
}
 



Gruß
Olaf

__________________________

http://138600.homepagemodules.de/

 Antworten

 Beitrag melden
30.07.2013 01:36 (zuletzt bearbeitet: 30.07.2013 01:37)
#7 RE: Chat-Aufruf über seitliches Menüfenster
avatar
Mitglied

Hallo und erst einmal besten Dank!!!
Ich habe meinen Fehler gefunden!
Ich hatte den Eintrag zu der vorhandenen CSS in der "Unteren Leiste" eingebaut, aber da funktioniert es komischerweise nicht!

Unter "CSS, HTML & Co" funktioniert es!!!

Da die Eintragungen hier Wirkung zeigen, habe ich eine weitere einfache Lösung gefunden (mit Hover-Effekt).

1
2
3
4
5
6
7
 
#xChat_global.disconnected, #xChatGuests {
margin-right:-125px;
}

#xChat_global.disconnected:hover, #xChatGuests.disconnected:hover {
margin:0px;
}
 




PS: Ich versuche noch runde Ecken einzubauen, aber es geht mal wieder nicht! Wo kann ich wirksam "border-radius:5px" unterbringen.

Gruß
Wolfgang

30.07.2013 09:53
avatar  Ludger
#8 RE: Chat-Aufruf über seitliches Menüfenster
avatar
Mitglied

1
2
3
4
5
6
7
8
9
10
 
#xChat_global.disconnected, #xChatGuests {
margin-right:-60px;
}

#xChat_global.disconnected:hover, #xChatGuests.disconnected:hover {
margin:0px;
}

.xChatHead div {
padding: 0px 0px !important;}
 



das sieht auch gut aus ... wenn der Code so korrek ist

viele Grüße
Lud

 Antworten

 Beitrag melden
30.07.2013 09:58 (zuletzt bearbeitet: 30.07.2013 09:59)
avatar  Ludger
#9 RE: Chat-Aufruf über seitliches Menüfenster
avatar
Mitglied

-

viele Grüße
Lud

 Antworten

 Beitrag melden
30.07.2013 10:00 (zuletzt bearbeitet: 30.07.2013 11:03)
#10 RE: Chat-Aufruf über seitliches Menüfenster
avatar
Junior Techniker
Muttersprache: Griechisch

Für "border-radius:5px" gibt es einen CSS Generator (er gilt für alle Browser ), zum Beispiel: http://css3generator.com/ .
Oder du kannst es mit Javascript probieren.

Das ist nur ein Beispiel:

<div id="target">Lorem Ipsum</div>

<script type="text/javascript">
var target = document.getElementById("target");
target.style.borderTopLeftRadius = "20px";
</script>

Viele Grüße,
Vasileios


 Junior-Technik


 Antworten

 Beitrag melden
30.07.2013 17:21 (zuletzt bearbeitet: 30.07.2013 17:24)
avatar  Olaf
#11 RE: Chat-Aufruf über seitliches Menüfenster
Ol
Mitglied

Zitat von wolf.andres im Beitrag #7

PS: Ich versuche noch runde Ecken einzubauen, aber es geht mal wieder nicht! Wo kann ich wirksam "border-radius:5px" unterbringen.



Ich nehme mal an,das Du das seitliche Chatfenster meinst...

Hier ein Beispiel in meiner CSS Vorlage von hier oben,um alle Browser anzusprechen:

1
2
3
4
5
6
7
8
9
10
11
12
 
#xChat_global.disconnected, #xChatGuests {
-moz-border-radius: 5px
-webkit-border-radius: 5px;
-khtml-border-radius: 5px;
border-radius: 5px;
max-width: 10px;
min-width: 0px ! important;
}

#xChat_global.disconnected:hover, #xChatGuests.disconnected:hover {
max-width: 300px;
}
 



Gruß
Olaf

__________________________

http://138600.homepagemodules.de/

 Antworten

 Beitrag melden
30.07.2013 17:30 (zuletzt bearbeitet: 30.07.2013 17:31)
avatar  Olaf
#12 RE: Chat-Aufruf über seitliches Menüfenster
Ol
Mitglied

Zitat von vasileios im Beitrag #10

Das ist nur ein Beispiel:

<div id="target">Lorem Ipsum</div>

<script type="text/javascript">
var target = document.getElementById("target");
target.style.borderTopLeftRadius = "20px";
</script>


Geht das eigentlich,das in Deinem Beispiel die ID und die Variable den gleichen Namen haben dürfen?

Gruß
Olaf

__________________________

http://138600.homepagemodules.de/

 Antworten

 Beitrag melden
31.07.2013 09:43
#13 RE: Chat-Aufruf über seitliches Menüfenster
avatar
Junior Techniker
Muttersprache: Griechisch

Ja du darfst, es gibt kein Problem.

Ein komplette Beispiel :

<!DOCTYPE html>
<html>
<body>
<div id="target" style="width:500px; background-color:red; padding:20px;">
<p id="p1">Hello World!</p>
<p id="p2">Hello World!</p>
</div>
<script>
var target = document.getElementById("target");
target.style.borderRadius = "20px";
</script>
</body>
</html>

Viele Grüße,
Vasileios


 Junior-Technik


 Antworten

 Beitrag melden
02.08.2013 19:15
#14 RE: Chat-Aufruf über seitliches Menüfenster
avatar
Mitglied

Hallo und besten Dank!
Ich habe jetzt die Chat-Leiste und das große Chat-Fenster angepasst.
Interessanter Weise kann man fast alles, mit etwas suchen, über die "CSS" (Eigene CSS) ohne Eingriff ins Template verändern.
Ich habe jetzt, weil es auch viel Arbeit in Anspruch genommen hat, einen Beitrag geschrieben.

Wer will kann mal vorbeischauen und den Chat-Zugriff (unten rechts) ausprobieren.

PS: Durch das viele Testen, habe ich die doch zahlreichen Funktionen (z.B. Ausblenden der Online-User-Spalte) finden können. Super!

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