Forum - Das neue Template Xobor (v6) » Xobor-Superklick in der Iconbar: Version 1-5

Um alle Funktionen nutzen zu k�nnen, aktivieren Sie bitte JavaScript in ihrem Browser!

Der Treffpunkt f�r Hilfe, Tricks & Tipps � XOBOR-Foren und Homepages � Das neue Template Xobor (v6) � Xobor-Superklick in der Iconbar: Version 1-5

Themen-Einstellungen

Thema drucken

Bereich wechseln

Start Willkommen! Ank�ndigungen & Termine, wichtige News! Stellen Sie Ihr eigene Webseite vor! Betriebssystem MS Windows Betriebssystem MS Windows 10, 8.1, 8 und 7 - Tricks & Tipps MS Windows 10, 8.1, 8 und 7 - Fragen & Antworten �rger mit Ihrem PC? �rger mit dem PC - Vorbeugung und Hilfe �rger mit dem PC - Fragen & Antworten Fragen zu DSL, VDSL, LTE und anderen Netzempfangsarten XOBOR-Foren und Homepages Alles f�r Ihr eigenes Forum oder Ihrer Webseite - Hilfe, Tricks & Tipps Alles f�r Ihr eigenes Forum oder Ihrer Webseite - Fragen & Antworten Das neue Template Xobor (v6) Energieerzeugung im neuen Zeitalter - Revolution�r! Videos und Webseiten zur Freien Energie Wasserstoff - Energietr�ger der Zukunft. Die besten Links Empfehlenswerte und interessante Links! Link - Suche Verschiedenes Faszinationen & Unglaubliches! Tricks & Tipps f�r Smartphones und iPhones Lob, Kritik & Verbesserungsvorschl�ge Spiel & Spa�, Witz & gute Laune! Spiritualit�t, Seele, New Age, Yoga, Gesundheit Alles, was noch so �brig bleibt Bannertausch Wie funktioniert der Bannertausch? Bannerrotation und Bannerwechsel

#1 | Xobor-Superklick in der Iconbar: Version 1-5 datum

19.04.2019 02:36 (zuletzt bearbeitet: 30.01.2023 15:32)

Wolfgang

Administrator

Informationen anzeigen

Beitr�ge:	3132
Registriert seit:	10.12.2006
Blog:	Wolfgangs Blog

Homepage:	Nicht angegeben
Letzte Spende	� Forum Spende
Likes	1018

Klicks und "Schiebung" für die Gruppen in der Iconbar: Version 1
Aktualisiert 07.12.21

Es gibt jetzt super inspirierende Skripte von "Ingmar" und "Olaf" aus dem Support!
Die "Iconbar" hat speziell für ihre Gruppen, mehrere Optionen hinzubekommen! Echt super!

Folgende Funktionen sind jetzt möglich:

Die Gruppen sind jetzt frei verschiebbar, mit einem Klick zu öffnen und zu schließen!
Die Gruppen bleiben nach einem Einfüge-Klick offen!
Die Gruppen haben ein "X" fürs Schließen bekommen!
Mit Randbegrenzung und gegenseitiger Auslösung!
Läuft reibungslos auch im "Standard" und im neuen Browser "Vivaldi"!
Wichtig! Alle Gruppen oberhalb vom "Xobor-Superklick" sind Klick-Gruppen,
alle unterhalb sind Mouseover-Gruppen!

Installation für die Templates (v1-4)

Damit man die Smiley-Fenster verschieben kann, wird das jQueryUI eingesetzt!
Es ist neu und funktioniert auch im Xobor (v6).
Läuft einwandfrei im alten IE, Edge, FF, Chrome, Opera, Safari und Vivaldi!
Eingeschränkt geht es auch mit älteren Versionen und den Exoten, wie K-Meleon und Pale Moon!
Interessanterweise lässt sich durch "draggable" die Eingabeaufforderung für "url" + "video" bewegen!
Allerdings nur im "IE" und "Safari".
Das folgende Script kann komplett in der Iconbar untergebracht werden!

Das folgende Script kann komplett in der Iconbar untergebracht werden!
"HTML-Baustein" unter "HTML" anlegen!
Namen vergeben z.B.: "Xobor Superklick" und unter "HTML:" das folgende Script eintragen!
Speichern nicht vergessen!
Werden die Zeilen 42-49 gelöscht, wird das gegenseitige Schließen der Smiley-Fenster aufgehoben!
Wenn jQueryUI bereits in der Iconbar installiert ist, Zeile 40 löschen (Wird auch benötigt in Multi-Dialog-Assistent, Smiley-Kategorienauswahl, Hilfe oder Color-Picker) !
In Zeile 31 wird die Hintergrundfarbe für jede Gruppe bestimmt!
Alle Gruppen, die mit einem Klick geöffnet werden und dieses Feature haben sollen, müssen oberhalb von diesem Script liegen!

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
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
 
<style>
.menue_close_xobor {
  background:#eeeeee; 
  width:auto; 
  border-bottom:1px solid #000000 !important; 
  position:absolute !important; 
  top:0; 
  left:0; 
  right:0; 
  line-height:25px; 
  border-radius:3px 3px 0 0; 
  cursor:move;
}
.menue_close_xobor span {
  width:40px; 
  font-size:13px; 
  font-weight:bold;
  color:#000000;  
  margin-right:-5px; 
  top:0px; 
  right:0px !important; 
  position:absolute !important; 
  cursor:pointer;
}
.menue_close_xobor span:hover {
  color:#901000; 
  font-size:110%;
}
 
form .xob_subiconlist {
  background:#ffffff; 
  min-width:150px; 
  padding-top:30px !important; 
  margin-top:20px !important; 
  border-radius:3px;
  z-index:999999;
}
</style>
 
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.min.js"></script>
<script>
/* Gegenseitige Auslösung! */
$('.xob_icon_cont.hassub').click(function(){
if(!$('.page_user, .treetalk, .smiley_move').length){
$('.xob_subiconlist').hide(300);
}else{
$('.xob_subiconlist').css('visibility','hidden').closest(this).find('.xob_subiconlist').css('visibility','visible');
};
});
 
/* Schließen-Funktion */
$('.xob_subiconlist').prepend('<div title="Verschieben möglich!" class="menue_close_xobor">&nbsp;<span title="Schlie&#223;en!">X</span></div>');
 
$('.xob_subiconlist').click(function(e){e.stopPropagation();})
function toggleSub(id){ if($('#xob_sub_'+id+'').is(':visible')){hideSub(id);} else{showSub(id);}};
 
$('.hassub').each(function(){
  var mof = $(this).attr('onmouseover');
  var subid = parseInt(mof.replace("showSub('","").replace("')",""));
  $(this).attr({'onmouseover':'','onmouseout':''}).click({id: subid},function(ev){toggleSub(ev.data.id);});
 
$('.menue_close_xobor span',this).click(function(){
  $(this).closest('.xob_subiconlist').hide(300);
});
 
$('.xob_subiconlist').draggable({containment: "body"}).css('position','absolute');
});
</script>
 

Schlie�en

Weitere interessante Links zur Iconbar:

  • Meine komplette Forum-Iconbar zum herunterladen
  • Beiträge nur für Mitglieder in der neuen Iconbar
  • Versteckte Kommentare in Forum-Beiträgen nutzen!
  • Smileys in der Schnellantwort
  • Glow - Leuchtender Text mit CSS3 "text-shadow"
  • Kleine Bildergalerie in der Iconbar
  • Kopiersperre / Markierungssperre / Eigenes Kontextmenü
  • Iconbar fixieren - gut für lange Beiträge
  • Suche "Iconbar"

Wichtig:

Neu! Xobor Superklick arbeitet jetzt auch mit der "Smiley-Kategorienauswahl zusammen!"

Besten Dank an Ingmar und Olaf für ihren Beitrag aus dem Support!
Bis dann und viel Spaß mit den neuen Skripten!

Wolfgang

nobody, Scannerxy, Hans58 und Nara finden das Top!

Antworten

#2 | Xobor-Superklick in der Iconbar: Erweiterter "X-Button" - Version 2 datum

28.04.2019 20:12 (zuletzt bearbeitet: 07.12.2021 01:28)

Wolfgang

Administrator

Informationen anzeigen

Beitr�ge:	3132
Registriert seit:	10.12.2006
Blog:	Wolfgangs Blog

Homepage:	Nicht angegeben
Letzte Spende	� Forum Spende
Likes	1018

Xobor-Superklick in der Iconbar: Erweiterter "X-Button" - Version 2
Aktualisiert 07.12.21

Möchte man das Schließen über den "X-Button" deutlicher hervorheben, gibt es mehrere Möglichkeiten!
Im folgenden Skript, kommt zum "X" eine Beschreibung hinzu z.B.: Schließen oder Exit!
Das Smiley-Fenster wird über die Titelleiste bewegt. Hier wird über ein Tooltipp darauf hingewiesen!

Was kann der neue X-Button?

Im folgende Skript wird beim "Mouseover" ein beliebiger Zusatztext eingeblendet z. B. "Schließen"!
Man kann auch weitere Informationen über ein Tooltipp einbringen wie, "Verschieben möglich!" oder "Fenster verschiebbar!"
Läuft reibungslos auch im "Standard" und im neuen Browser "Vivaldi"!
Mit Randbegrenzung und gegenseitiger Auslösung!
Wegen der Zusatztexte eignet sich diese Version für große Smiley-Gruppen mit längeren Titelleisten!
Die Gruppen sind jetzt frei verschiebbar, mit einem Klick zu öffnen und zu schließen!
Die Gruppen bleiben nach einem Einfüge-Klick offen!
Wichtig! Alle Gruppen oberhalb vom "Xobor-Superklick" sind Klick-Gruppen,
alle unterhalb sind Mouseover-Gruppen!

Installation für die Templates (v1-4)

Damit man die Smiley-Fenster verschieben kann, wird das jQueryUI eingesetzt!
Es ist neu und funktioniert auch im Xobor (v6).
Läuft einwandfrei im alten IE, Edge, FF, Chrome, Opera, Safari und Vivaldi!
Eingeschränkt geht es auch mit älteren Versionen und den Exoten, wie K-Meleon und Pale Moon!
Interessanterweise lässt sich durch "draggable" die Eingabeaufforderung für "url" + "video" bewegen!
Allerdings nur im "IE" und "Safari".
Das folgende Script kann komplett in der Iconbar untergebracht werden!

Das folgende Script kann komplett in der Iconbar untergebracht werden!
"HTML-Baustein" unter "HTML" anlegen!
Namen vergeben z.B.: "Xobor Superklick" und unter "HTML:" das folgende Script eintragen!
Speichern nicht vergessen!
Wenn jQueryUI bereits in der Iconbar installiert ist, Zeile 46 löschen (Wird auch benötigt in Multi-Dialog-Assistent, Smiley-Kategorienauswahl, Hilfe oder Color-Picker) !
In Zeile 37 wird die Hintergrundfarbe für jede Gruppe bestimmt!
Werden die Zeilen 48-55 gelöscht, wird das gegenseitige Schließen der Smiley-Fenster aufgehoben!
Fügt man die Class ".xob_icon" in Zeile 49 hinzu, schließt das Fenster nach dem Einfügen!
Alle Gruppen, die mit einem Klick geöffnet werden und dieses Feature haben sollen, müssen oberhalb von diesem Script liegen!

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
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
 
<style>
.menue_close_xobor {
  background:#eeeeee; 
  width:auto; 
  border-bottom:1px solid #000000 !important; 
  position:absolute !important; 
  top:0; 
  left:0; 
  right:0; 
  line-height:25px; 
  border-radius:3px 3px 0 0; 
  cursor:move;
}
.menue_close_xobor div {
  min-width:40px; 
  font-size:13px; 
  color:#383838; 
  font-weight:bold; 
  top:0px !important; 
  right:0; 
  margin-right:-5px; 
  position:absolute !important; 
  cursor:pointer;
}
.menue_close_xobor_div span {
  font-size:12px !important; 
  font-weight:bold;
  color:#901000; 
  padding-top:1px; 
  padding-right:25px !important; 
  display: none; 
  cursor:pointer;
}
.menue_close_xobor_div:hover span {display:block;}
 
form .xob_subiconlist {
  background:#ffffff;  
  min-width:150px; 
  padding-top:30px !important; 
  margin-top:20px !important; 
  border-radius:3px; 
  z-index:999999;
}
</style>
 
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.min.js"></script>
<script>
/* Gegenseitige Auslösung! */
$('.xob_icon_cont.hassub').click(function(){
if(!$('.page_user, .treetalk, .smiley_move').length){
$('.xob_subiconlist').hide(300);
}else{
$('.xob_subiconlist').css('visibility','hidden').closest(this).find('.xob_subiconlist').css('visibility','visible');
};
});
 
/* Schließen- und Verschiebe-Funktion */
$('.xob_subiconlist').prepend('<div title="Verschieben möglich!" class="menue_close_xobor">&nbsp;<div title="&nbsp;" class="menue_close_xobor_div"><span>Schließen!</span><div>X</div></div>');
 
$('.xob_subiconlist').click(function(e){e.stopPropagation();})
function toggleSub(id){ if($('#xob_sub_'+id+'').is(':visible')){hideSub(id);} else{showSub(id);}};
 
$('.hassub').each(function(){
  var mof = $(this).attr('onmouseover');
  var subid = parseInt(mof.replace("showSub('","").replace("')",""));
  $(this).attr({'onmouseover':'','onmouseout':''}).click({id: subid},function(ev){toggleSub(ev.data.id);});
 
$('.menue_close_xobor div',this).click(function(){
  $(this).closest('.xob_subiconlist').hide(300);
});
 
$('.xob_subiconlist').draggable({containment: "body"}).css('position','absolute');
});
</script>
 

Schlie�en

Wichtig:

Neu! Xobor Superklick arbeitet jetzt auch mit der "Smiley-Kategorienauswahl zusammen!"

Besten Dank an nobody für ihre interessante Idee!
Bis dann und viel Spaß mit dem neuen Skript!

Wolfgang

Nara findet das Top!

Antworten

#3 | Xobor-Superklick in der Iconbar: Erweiterung mit "Schließen-Button" - Version 3 datum

29.04.2019 06:18 (zuletzt bearbeitet: 07.12.2021 01:28)

Wolfgang

Administrator

Informationen anzeigen

Beitr�ge:	3132
Registriert seit:	10.12.2006
Blog:	Wolfgangs Blog

Homepage:	Nicht angegeben
Letzte Spende	� Forum Spende
Likes	1018

Xobor-Superklick in der Iconbar: Erweiterung mit "Schließen-Button" - Version 3
Aktualisiert 07.12.21

In folgenden Skript wird ein "Schließen-Button" in die Smiley-Gruppe nach links unten platziert!
Das Smiley-Fenster wird über die Titelleiste bewegt. Hier wird über ein Tooltipp darauf hingewiesen!

Wo wird der neue Schließen-Button platziert?

Der Button ist gut zu sehen und immer gut erreichbar!
Weiterhin ist es möglich die Gruppen mit einer gemeinsamen Hintergrundfarbe auszustatten!
Mit Randbegrenzung und gegenseitiger Auslösung!
Läuft reibungslos auch im "Standard" und im neuen Browser "Vivaldi"!
Die Gruppen sind frei verschiebbar, mit einem Klick zu öffnen und zu schließen!
Die Gruppen bleiben nach einem Einfüge-Klick offen!
Wichtig! Alle Gruppen oberhalb vom "Xobor-Superklick" sind Klick-Gruppen,
alle unterhalb sind Mouseover-Gruppen!

Installation für die Templates (v1-4)

Damit man die Smiley-Fenster verschieben kann, wird das jQueryUI eingesetzt!
Es ist neu und funktioniert auch im Xobor (v6).
Läuft einwandfrei im alten IE, Edge, FF, Chrome, Opera, Safari und Vivaldi!
Eingeschränkt geht es auch mit älteren Versionen und den Exoten, wie K-Meleon und Pale Moon!
Interessanterweise lässt sich durch "draggable" die Eingabeaufforderung für "url" + "video" bewegen!
Allerdings nur im "IE" und "Safari".
Das folgende Script kann komplett in der Iconbar untergebracht werden!

Das folgende Script kann komplett in der Iconbar untergebracht werden!
"HTML-Baustein" unter "HTML" anlegen!
Namen vergeben z.B.: "Xobor Superklick" und unter "HTML:" das folgende Script eintragen!
Speichern nicht vergessen!
Wenn jQueryUI bereits in der Iconbar installiert ist, Zeile 32 löschen (Wird auch benötigt in Multi-Dialog-Assistent, Smiley-Kategorienauswahl, Hilfe oder Color-Picker) !
In Zeile 22 wird die Hintergrundfarbe für jede Gruppe bestimmt!!
In Zeile 2-19 wird der Button-Text angepasst!
Werden die Zeilen 34-41 gelöscht, wird das gegenseitige Schließen der Smiley-Fenster aufgehoben!
Fügt man die Class ".xob_icon" in Zeile 35 hinzu, schließt das Fenster nach dem Einfügen!
Alle Gruppen, die mit einem Klick geöffnet werden und dieses Feature haben sollen, müssen oberhalb von diesem Script liegen!

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
51
52
53
54
55
56
57
58
59
60
61
 
<style>
.menue_close_xobor {
  background:#eeeeee; 
  font-size:12px; 
  font-weight:bold; 
  color: #383838;
  padding:0 10px !important; 
  margin:5px 0 5px 5px !important; 
  line-height:15px;
  border:1px solid #555555; 
  border-radius:3px; 
  position:absolute; 
  bottom:0; 
  cursor:pointer;
}
.menue_close_xobor:hover {  
  background:#cccccc !important;
  color:#000000 !important; 
}
 
form .xob_subiconlist {
  background:#ffffff; 
  min-width:150px; 
  padding-bottom:30px !important; 
  margin-top:20px !important; 
  border-radius:3px; 
  cursor: move; 
  z-index:999999;
}
</style>
 
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.min.js"></script>
<script>
/* Gegenseitige Auslösung! */
$('.xob_icon_cont.hassub').click(function(){
if(!$('.page_user, .treetalk, .smiley_move').length){
$('.xob_subiconlist').hide(300);
}else{
$('.xob_subiconlist').css('visibility','hidden').closest(this).find('.xob_subiconlist').css('visibility','visible');
};
});
 
/* Schließen-Funktion */
$('.xob_subiconlist').prepend('<div title="&nbsp;" class="menue_close_xobor"><span>Schließen</span></div>');
 
 
$('.xob_subiconlist').click(function(e){e.stopPropagation();})
function toggleSub(id){ if($('#xob_sub_'+id+'').is(':visible')){hideSub(id);} else{showSub(id);}};
 
$('.hassub').each(function(){
  var mof = $(this).attr('onmouseover');
  var subid = parseInt(mof.replace("showSub('","").replace("')",""));
  $(this).attr({'onmouseover':'','onmouseout':''}).click({id: subid},function(ev){toggleSub(ev.data.id);});
 
$('.menue_close_xobor span',this).click(function(){
  $(this).closest('.xob_subiconlist').hide(300);
});
 
$('.xob_subiconlist').draggable({containment: "body"}).css('position','absolute');
});
</script>
 

Schlie�en

Wichtig:

Neu! Xobor Superklick arbeitet jetzt auch mit der "Smiley-Kategorienauswahl zusammen!"

Bis dann und viel Spaß mit dem neuen Skript!

Wolfgang

Nara findet das Top!

Antworten

#4 | Xobor-Superklick in der Iconbar: Erweiterung mit "Schließen- und Move-Button" - Version 4 datum

01.05.2019 01:47 (zuletzt bearbeitet: 07.12.2021 01:28)

Wolfgang

Administrator

Informationen anzeigen

Beitr�ge:	3132
Registriert seit:	10.12.2006
Blog:	Wolfgangs Blog

Homepage:	Nicht angegeben
Letzte Spende	� Forum Spende
Likes	1018

Xobor-Superklick in der Iconbar: Erweiterung mit "Schließen- und Move-Button" - Version 4
Aktualisiert 06.12.21

Im folgenden Skript wird der "Schließen-Button" oben rechts platziert,
hinzu kommt zur deutlichen Hervorhebung oben links ein "Move-Button"!

Was kann der neue Xobor-Superklick?

Der Button ist gut zu sehen und immer gut erreichbar!
Weiterhin ist es möglich die Gruppen mit einer gemeinsamen Hintergrundfarbe auszustatten!
Zusätzlich kommt noch ein "Fenster verschieben - Button" (Move-Button) dazu!
Das Fenster verschieb sich nur, wenn der Maus-Zeiger auf dem "Move-Button" steht!
Mit Randbegrenzung und gegenseitiger Auslösung!
Weiterhin ist es möglich die Gruppen mit einer gemeinsamen Hintergrundfarbe auszustatten!
Läuft reibungslos auch im "Standard" und im neuen Browser "Vivaldi"!
Die Gruppen sind frei verschiebbar, mit einem Klick zu öffnen und zu schließen!
Die Gruppen bleiben nach einem Einfüge-Klick offen!
Wichtig! Alle Gruppen oberhalb vom "Xobor-Superklick" sind Klick-Gruppen,
alle unterhalb sind Mouseover-Gruppen!

Installation für die Templates (v1-4)

Damit man die Smiley-Fenster verschieben kann, wird das jQueryUI eingesetzt!
Es ist neu und funktioniert auch im Xobor (v6).
Läuft einwandfrei im alten IE, Edge, FF, Chrome, Opera, Safari und Vivaldi!
Eingeschränkt geht es auch mit älteren Versionen und den Exoten, wie K-Meleon und Pale Moon!
Interessanterweise lässt sich durch "draggable" die Eingabeaufforderung für "url" + "video" bewegen!
Allerdings nur im "IE" und "Safari".
Das folgende Script kann komplett in der Iconbar untergebracht werden!

Das folgende Script kann komplett in der Iconbar untergebracht werden!
"HTML-Baustein" unter "HTML" anlegen!
Namen vergeben z.B.: "Xobor Superklick" und unter "HTML:" das folgende Script eintragen!
Speichern nicht vergessen!
Wenn jQueryUI bereits in der Iconbar installiert ist, Zeile 45 löschen (Wird auch benötigt in Multi-Dialog-Assistent, Smiley-Kategorienauswahl, Hilfe oder Color-Picker) !
In Zeile 2+33 können die Button angepasst werden!
In Zeile 36 wird die Hintergrundfarbe der Smiley-Gruppen bestimmt!!
Werden die Zeilen 47-54 gelöscht, wird das gegenseitige Schließen der Smiley-Fenster aufgehoben!
Alle Gruppen, die mit einem Klick geöffnet werden und dieses Feature haben sollen, müssen oberhalb von diesem Script liegen!

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
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
 
<style>
.menue_close_xobor span {
  background:#eeeeee; 
  font-size:12px; 
  font-weight:bold; 
  color:#383838; 
  padding:0 10px !important; 
  border-radius:8px;
  border:1px solid #333333;
  line-height:15px; 
  width:auto; 
  position:absolute !important; 
  top:8px; 
  right:5px; 
  cursor:pointer;
}
.menue_close_xobor:hover {
  background:#cccccc !important;
  color:#000000 !important; 
}
.menue_track_xobor:hover img {
  background:#cccccc;
}
.menue_track_xobor img {
background:#f3f3f3; 
line-height:15px; 
border:1px solid #333333; 
border-radius:8px; 
position:absolute; 
left:10px; 
top:5px; 
cursor:move;
}
 
form .xob_subiconlist {
  background:#ffffff; 
  min-width:180px; 
  padding-top:25px !important; 
  margin-top:20px !important; 
  border-radius:3px; 
  z-index:999999; 
  cursor:default;}
</style>
 
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.min.js"></script> 
<script>
/* Gegenseitige Auslösung! */
$('.xob_icon_cont.hassub').click(function(){
if(!$('.page_user, .treetalk, .smiley_move').length){
$('.xob_subiconlist').hide(300);
}else{
$('.xob_subiconlist').css('visibility','hidden').closest(this).find('.xob_subiconlist').css('visibility','visible');
};
});
 
/* Schließen- und Verschiebe-Funktion */
$('.xob_subiconlist').prepend('<div class="menue_track_xobor" title="&nbsp;"><img src="https://files.homepagemodules.de/b104774/a_168_593e22ed.png" width="18px"></div><div class="menue_close_xobor" title="&nbsp;"><span>Schließen!</span></div>');
 
$('.xob_subiconlist').click(function(e){e.stopPropagation();})
function toggleSub(id){ if($('#xob_sub_'+id+'').is(':visible')){hideSub(id);} else{showSub(id);}};
 
$('.hassub').each(function(){
  var mof = $(this).attr('onmouseover');
  var subid = parseInt(mof.replace("showSub('","").replace("')",""));
  $(this).attr({'onmouseover':'','onmouseout':''}).click({id: subid},function(ev){toggleSub(ev.data.id);});
 
$('.menue_close_xobor span',this).click(function(){
  $(this).closest('.xob_subiconlist').hide(300);
});
 
$('.xob_subiconlist').draggable({containment: "body"}).css('position','absolute');
});
</script>
 

Schlie�en

Wichtig:

Neu! Xobor Superklick arbeitet jetzt auch mit der "Smiley-Kategorienauswahl zusammen!"

Bis dann und viel Spaß mit dem neuen Skript!

Wolfgang

Scannerxy, nobody und Nara finden das Top!

Antworten

#5 | Xobor-Superklick mit Titelleiste - Version 5 datum

04.05.2019 09:00 (zuletzt bearbeitet: 07.12.2021 01:29)

Wolfgang

Administrator

Informationen anzeigen

Beitr�ge:	3132
Registriert seit:	10.12.2006
Blog:	Wolfgangs Blog

Homepage:	Nicht angegeben
Letzte Spende	� Forum Spende
Likes	1018

Xobor-Superklick mit Titelleiste - Version 5
Aktualisiert 26.07.22

Im folgenden Skript werden die Gruppen mit einer "Titelleiste" ausgerüstet, die das Schließen und Verschieben ermöglichen!

Was kann die neue Titelleiste?

Hier wird das Verschieben auf die gesamte Länge der Titelleiste ausgedehnt!
Ein unbeabsichtigtes Schließen wird minimiert!
Hinzu kommt noch der bewährte "Schließen-Button"!
Die Gruppen sind jetzt frei verschiebbar, mit einem Klick zu öffnen und zu schließen und bleiben nach einem Einfüge-Klick offen!
Die Titelleiste passt sich automatisch den Template-Farben an (v1+4)!
Mit Randbegrenzung und gegenseitiger Auslösung!
Läuft jetzt auch im neuen Browser "Vivaldi"!
Wichtig! Alle Gruppen oberhalb vom "Xobor-Superklick" sind Klick-Gruppen,
alle unterhalb sind Mouseover-Gruppen!

Installation für die Templates (v1-4)

Damit man die Smiley-Fenster verschieben kann, wird das jQueryUI eingesetzt!
Es ist neu und funktioniert auch im Xobor (v6).
Läuft einwandfrei im alten IE, Edge, FF, Chrome, Opera, Safari und Vivaldi!
Eingeschränkt geht es auch mit älteren Versionen und den Exoten, wie K-Meleon und Pale Moon!
Interessanterweise lässt sich durch "draggable" die Eingabeaufforderung für "url" + "video" bewegen!
Allerdings nur im "IE" und "Safari".
Das folgende Script kann komplett in der Iconbar untergebracht werden!

Das folgende Script kann komplett in der Iconbar untergebracht werden!
"HTML-Baustein" unter "HTML" anlegen!
Namen vergeben z.B.: "Xobor Superklick" und unter "HTML:" das folgende Script eintragen!
Speichern nicht vergessen!
Wenn jQueryUI bereits in der Iconbar installiert ist, Zeile 68 löschen (Wird auch benötigt in Multi-Dialog-Assistent, Smiley-Kategorienauswahl, Hilfe oder Color-Picker) !
In Zeile 57 kann die Hintergrundfarbe mit "background" für die Smiley-Gruppen bestimmt werden!
Wichtig ! Alle Gruppen, die mit einem Klick geöffnet werden sollen, müssen oberhalb von diesem Script liegen!

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
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
 
<style>
.menue_close_xobor span {
  background:#eeeeee; 
  font-size:12px; 
  font-weight:bold; 
  color:#383838; 
  padding:0 10px !important; 
  border-radius:8px;
  border:1px solid #333333;
  line-height:15px; 
  width:auto; 
  position:absolute !important; 
  top:8px; 
  right:5px; 
  cursor:pointer;
}
.menue_close_xobor span:hover {
  background:#cccccc;
  color:#000000;
}
.menue_close_xobor:hover {
  background:#cccccc !important;
  color:#000000 !important; 
}
.menue_track_xobor {
  width:100%; 
  cursor:move;
}
.menue_track_xobor img {
background:#f3f3f3; 
line-height:15px; 
border:1px solid #333333; 
border-radius:8px; 
position:absolute; 
left:10px; 
top:5px; 
cursor:move;
}
.menue_track_xobor:hover img {
  background:#cccccc;
}
.menue_move_xobor {
  width:100%; 
  background:#eeeeee; 
  height:25px !important; 
  line-height:13px; 
  border-bottom:1px solid #000000 !important;
  border-radius:6px 6px 0 0 !important;
  position:absolute !important; 
  top:0; 
  left:0; 
}
.menue_move_xobor td {
  background:none;
} 
form .xob_subiconlist {
  background:#ffffff; 
  min-width:180px; 
  padding-top:25px !important; 
  margin-top:20px !important; 
  border-radius:3px; 
  z-index:999999; 
  cursor:default;
}
</style>
 
 
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.min.js"></script>
<script>
/* Gegenseitige Auslösung! */
$('.xob_icon_cont.hassub').click(function(){
if(!$('.page_user, .treetalk, .smiley_move').length){
$('.xob_subiconlist').hide(300);
}else{
$('.xob_subiconlist').css('visibility','hidden').closest(this).find('.xob_subiconlist').css('visibility','visible');
};
});
 
/* Schließen- und Verschiebe-Funktion */
$('.xob_subiconlist').prepend('<div class="menue_track_xobor" title="&nbsp;"><img src="https://files.homepagemodules.de/b104774/a_168_593e22ed.png" width="18px"></div><div class="menue_close_xobor" title="&nbsp;"><span>Schließen!</span></div>');
 
$('.xob_subiconlist').click(function(e){e.stopPropagation();})
function toggleSub(id){ if($('#xob_sub_'+id+'').is(':visible')){hideSub(id);} else{showSub(id);}};
 
$('.hassub').each(function(){
var mof = $(this).attr('onmouseover');
var subid = parseInt(mof.replace("showSub('","").replace("')",""));
$(this).attr({'onmouseover':'','onmouseout':''}).click({id: subid},function(ev){toggleSub(ev.data.id);});
 
$('.menue_close_xobor span',this).click(function(){
$(this).closest('.xob_subiconlist').hide(300);
});
 
$('.xob_subiconlist').draggable({containment: "body"}).css('position','absolute');
});
</script>
 

Schlie�en

Das folgende Script kann komplett in der Iconbar untergebracht werden!
"HTML-Baustein" unter "HTML" anlegen!
Namen vergeben z.B.: "Xobor Superklick" und unter "HTML:" das folgende Script eintragen!
Speichern nicht vergessen!
Wenn jQueryUI bereits in der Iconbar installiert ist, Zeile 46 löschen (Wird auch benötigt in Multi-Dialog-Assistent, Smiley-Kategorienauswahl, Hilfe oder Color-Picker) !
In Zeile 2-16 kann der Schließen-Button und in Zeile 21-31 der Move-Button angepasst werden!
In Zeile 37 kann die Hintergrundfarbe mit "background" für die Smiley-Gruppen bestimmt werden!
Wichtig ! Alle Gruppen, die mit einem Klick geöffnet werden sollen, müssen oberhalb von diesem Script liegen!

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
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
 
<style>
.menue_close_xobor span {
  background:#ffffff; 
  font-size:12px !important; 
  color:#000000; 
  font-weight:bold; 
  padding:0 10px; 
  margin-right:5px;
  border:1px solid #000000; 
  border-radius:8px; 
  cursor:pointer; 
}
.menue_close_xobor span:hover {
  background:#cccccc;
  color:#000000;
}
.menue_track_xobor {
  width:100%; 
  cursor:move;
}
.menue_move_xobor {
  width:100%; 
  background:#eeeeee; 
  height:25px !important; 
  line-height:13px; 
  border-bottom:1px solid #000000 !important;
  border-radius:6px 6px 0 0 !important;
  position:absolute !important; 
  top:0; 
  left:0; 
}
.menue_move_xobor td {
  background:none;
}
 
form .xob_subiconlist {
  background:#ffffff; 
  min-width:180px; 
  border-radius:6px 6px 2px 2px; 
  z-index:999999; 
  cursor:default;
}
</style>
 
 
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.min.js"></script>
<script>
/* Gegenseitige Auslösung! */
$('.xob_icon_cont.hassub').click(function(){
if(!$('.page_user, .treetalk, .smiley_move').length){
$('.xob_subiconlist').hide(300);
}else{
$('.xob_subiconlist').css('visibility','hidden').closest(this).find('.xob_subiconlist').css('visibility','visible');
};
});
 
/* Titelleiste fürs Schließen und Verschieben */
$('.xob_subiconlist').prepend('<table class="menue_move_xobor boxheader ntit"><tr><td title="Verschieben" class="menue_track_xobor"></td><td class="menue_close_xobor" title="Schlie&#223;en"><span>X</span></td><tr></table>').css({'padding-top':'25px','margin-top':'20px'});
 
$('.xob_subiconlist').click(function(e){e.stopPropagation();})
function toggleSub(id){ if($('#xob_sub_'+id+'').is(':visible')){hideSub(id);} else{showSub(id);}};
 
$('.hassub').each(function(){
  var mof = $(this).attr('onmouseover');
  var subid = parseInt(mof.replace("showSub('","").replace("')",""));
  $(this).attr({'onmouseover':'','onmouseout':''}).click({id: subid},function(ev){toggleSub(ev.data.id);});
 
$('.menue_close_xobor span',this).click(function(){
  $(this).closest('.xob_subiconlist').hide(300);
});
 
$('.xob_subiconlist').draggable({containment: "body"}).css('position','absolute');
});
</script>
 

Schlie�en

Wichtig:

Neu! Xobor Superklick arbeitet jetzt auch mit der "Smiley-Kategorienauswahl zusammen!"

Viel Spaß mit dem neuen Skript
und besten Dank an nobody für die Inspiration "Vivaldi"!!!

Wolfgang

Scannerxy, Nara und Daishi finden das Top!

Antworten

#6 | Xobor-Superklick mit Randbegrenzung! datum

04.11.2019 20:43 (zuletzt bearbeitet: 16.03.2020 20:10)

Xobor-Superklick mit Randbegrenzung!

Mit dem Xobor-Superklick ist es möglich, jede erstellte Gruppe in der Iconbar frei zu bewegen (durch "draggable").
Allerdings ist es auch möglich die Gruppe über den Rand hinaus ins Nirwana zu schieben!

Lösung:
Mit Hilfe einer zusätzlichen Option "containment", kann man hier auf einfachste Weise Abhilfe schaffen!
Nimmt man für diese Randbegrenzung den Eintrag "body", so können die Gruppen nur bis zu den Rändern und nicht darüber hinaus, geschoben werden!
Bei einem vertikalen Scrollbalken und "body" scrollt die Seite mit, wenn die Gruppe nach unten geschoben wird!
Funktioniert in allen Template und gängigen Browsern!
Alles bleibt somit gut erkenn- und lesbar!
Will man den Aktionsradius weiter einschränken, ist der Eintrag ".container" noch sinnvoll.
Funktioniert nur im Business-Template!
Für das Standard-Template ist auch "tbody" einsetzbar!

$(".xob_subiconlist").draggable({containment: "body"});

PS: Die Randbegrenzung ist in allen 5 Versionen nachgetragen worden!

Bis dann

Wolfgang

Antworten

#7 | Xobor-Superklick mit gegenseitiger Auslösung! datum

08.11.2019 16:50 (zuletzt bearbeitet: 15.10.2021 14:52)

Wolfgang

Administrator

Informationen anzeigen

Beitr�ge:	3132
Registriert seit:	10.12.2006
Blog:	Wolfgangs Blog

Homepage:	Nicht angegeben
Letzte Spende	� Forum Spende
Likes	1018

Xobor-Superklick mit gegenseitiger Auslösung!
Aktualisiert 25.07.22

Mit dem Xobor-Superklick ist es möglich, jede erstellte Gruppe in der Iconbar zu öffnen, offen stehen zu lassen oder zu schließen!
Ein ungewolltes Öffnen durch ein "mouseover" ist jetzt Schnee von gestern!

Aber! Es hat sich gezeigt, dass viele geöffnete Gruppen viel Platz einnehmen, auch stören können!
Ein wegklicken mit dem X-Button erhöht dann wieder den Arbeitsaufwand!
Hinzu kommt, dass man beim Schreiben nicht ständig Smileys oder ständig die Farbe ändert wird!
Ein Offenstehen der Gruppen ist, denke ich, in den meisten Fällen nicht notwendig!

Lösung:
Mit dem folgenden Eintrag schließen sich die Gruppen gegenseitig und es steht somit nur max. eine Gruppe offen, die, wenn sie nicht mehr gebraucht wird, auch mit dem X-Button geschlossen werden kann!
Mit einem zusätzlichen Eintrag ist es möglich die Gruppe zu schließen, wenn min. 1 Smiley eingefügt wurde!

Xobor-Superklick mit gegenseitiger Auslösung für die Versionen 1-5

Zeile 4 können die Animationszeiten für die gegenseitige Auslösung angepasst werden!
Funktioniert auch in der Smiley-Kategorienauswahl

1
2
3
4
5
6
7
8
 
/* Gegenseitige Auslösung! */
$('.xob_icon_cont.hassub').click(function(){
if(!$('.page_user, .treetalk, .smiley_move').length){
$('.xob_subiconlist').hide(300);
}else{
$('.xob_subiconlist').css('visibility','hidden').closest(this).find('.xob_subiconlist').css('visibility','visible');
};
});
 

Wichtig:

Xobor Superklick arbeitet jetzt auch mit der "Smiley-Kategorienauswahl zusammen!

Viel Spaß

Wolfgang

Antworten

#8 | Aktualisiert: Xobor-Superklick in der Iconbar: Version 1-5 datum

25.09.2021 15:59 (zuletzt bearbeitet: 15.10.2021 14:57)

Aktualisiert: Xobor-Superklick in der Iconbar / Version 1-5

Xobor-Superklick mit den Versionen 1-5 wurde aktualisiert!

Was kann der Xobor-Superklick und was hat sich im Laufe der 2 Jahre alles geändert?

Die Gruppen sind frei verschiebbar, mit einem Klick zu öffnen und zu schließen!
Die Gruppen bleiben nach einem Einfüge-Klick offen, können aber optional nach Einfügen min. eines Smileys wieder geschlossen werden!
Die Gruppen schließen sich gegenseitig, können aber optional offen bleiben!
Die Gruppen sind mit verschiedenen Verschiebe- und Schieß-Möglichkeiten ausgerüstet!
Fürs Verschieben der Gruppen-Fenster ist eine Randbegrenzung eingebaut, damit die Fenster nicht ins Nirvana verschwinden können!
Läuft reibungslos auch im "Standard" und im neuen Browser "Vivaldi"!
Funktioniert jetzt auch im Business-Gästebuch (Nur das gegenseitige Auslösen funktioniert nicht)!
Wichtig! Alle Gruppen oberhalb vom "Xobor-Superklick" sind Klick-Gruppen,
alle unterhalb sind Mouseover-Gruppen!

Was wurde an den Skripten geändert?

Kleine Formatfehler für die Templates (v1-4) behoben!
Abstand der Gruppenfenster zur Iconbar vergrößert (bessere Sicht auf die Iconbar)!
Ist die gegenseitige Auslösung aktiviert, werden die Gruppenfenster animiert geöffnet und geschlossen!
Skript minimiert!

Wichtig:

Xobor Superklick arbeitet jetzt mit der "Smiley-Kategorienauswahl zusammen!

Bis dann
Wolfgang

Antworten

Countdown-Timer: Javascript läuft falsch � � Iconbar mobil fürs Xobor (v6) anpassen

�hnliche Themen

Antworten

Letzter Beitrag

Xobor-Spoiler mit Grafik in der Titelleiste
Erstellt im Forum Alles f�r Ihr eigenes Forum oder Ihrer Webseite - Hilfe, Tricks & Tipps von Wolfgang 1 04.07.2022 22:30
Daishi • Zugriffe: 386
Iconbar mobil fürs Xobor (v6) anpassen
Erstellt im Forum Das neue Template Xobor (v6) von Wolfgang 0 12.10.2021 19:34
Wolfgang • Zugriffe: 313
Xobor-Spoiler mit Hinweis
Erstellt im Forum Das neue Template Xobor (v6) von Wolfgang 0 01.01.2021 19:49
Wolfgang • Zugriffe: 855

Für die Iconbar: Smileys mit einstellbarer Größe!
Erstellt im Forum Alles f�r Ihr eigenes Forum oder Ihrer Webseite - Hilfe, Tricks & Tipps von Wolfgang

02.02.2020 15:37
von

Wolfgang • Zugriffe: 920

Xobor Plugins erstellen, versenden und bearbeiten!
Erstellt im Forum Alles f�r Ihr eigenes Forum oder Ihrer Webseite - Hilfe, Tricks & Tipps von Wolfgang

09.12.2019 22:11
von

mike48 • Zugriffe: 1607

Super Kategorienauswahl für das Smiley-Menü - Version 1-3
Erstellt im Forum Das neue Template Xobor (v6) von Wolfgang 4 16.10.2021 10:18
Wolfgang • Zugriffe: 2933

Meine komplette Forum-Iconbar zum herunterladen!
Erstellt im Forum Alles f�r Ihr eigenes Forum oder Ihrer Webseite - Hilfe, Tricks & Tipps von Wolfgang

30.07.2022 15:39
von

EaglePipe • Zugriffe: 5690

Besonderheiten zur Xobor-Iconbar
Erstellt im Forum Alles f�r Ihr eigenes Forum oder Ihrer Webseite - Hilfe, Tricks & Tipps von Wolfgang 0 13.07.2015 15:58
Wolfgang • Zugriffe: 1734

Xobor-Spoiler mit neuen Formatierungen ausstatten
Erstellt im Forum Alles f�r Ihr eigenes Forum oder Ihrer Webseite - Hilfe, Tricks & Tipps von Wolfgang

24.11.2019 09:29
von

Wolfgang • Zugriffe: 2877

Foren Spende

Hallo !

Wir hoffen, dass Dir unser Forum gef�llt und Du Dich hier genauso wohlf�hlst wie wir.

Um Dir und den anderen Mitgliedern das Bestm�gliche bieten zu k�nnen, w�rden wir das Forum gern werbefrei gestalten, mit tollen neuen Extras erg�nzen.

Wenn Du uns dabei unterst�tzen m�chtest, kannst Du mit Hilfe einer kleinen Spende dazu beitragen.

Deine Spende hilft!

Spendenziel: 85 €

123%

Google Translator

Forum - Das neue Template Xobor (v6) » Xobor-Superklick in der Iconbar: Version 1-5

Klicks und "Schiebung" für die Gruppen in der Iconbar: Version 1Aktualisiert 07.12.21

Xobor-Superklick in der Iconbar: Erweiterter "X-Button" - Version 2Aktualisiert 07.12.21

Xobor-Superklick in der Iconbar: Erweiterung mit "Schließen-Button" - Version 3Aktualisiert 07.12.21

Xobor-Superklick in der Iconbar: Erweiterung mit "Schließen- und Move-Button" - Version 4Aktualisiert 06.12.21

Xobor-Superklick mit Titelleiste - Version 5Aktualisiert 26.07.22

Xobor-Superklick mit Randbegrenzung!

Xobor-Superklick mit gegenseitiger Auslösung!Aktualisiert 25.07.22

Aktualisiert: Xobor-Superklick in der Iconbar / Version 1-5

Klicks und "Schiebung" für die Gruppen in der Iconbar: Version 1
Aktualisiert 07.12.21

Xobor-Superklick in der Iconbar: Erweiterter "X-Button" - Version 2
Aktualisiert 07.12.21

Xobor-Superklick in der Iconbar: Erweiterung mit "Schließen-Button" - Version 3
Aktualisiert 07.12.21

Xobor-Superklick in der Iconbar: Erweiterung mit "Schließen- und Move-Button" - Version 4
Aktualisiert 06.12.21

Xobor-Superklick mit Titelleiste - Version 5
Aktualisiert 26.07.22

Xobor-Superklick mit gegenseitiger Auslösung!
Aktualisiert 25.07.22