#1 Xobor-Superklick in der Iconbar: Version 1-5 von Wolfgang 19.04.2019 02:36

avatar

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:



Wichtig:






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

Wolfgang

#2 Xobor-Superklick in der Iconbar: Erweiterter "X-Button" - Version 2 von Wolfgang 28.04.2019 20:12

avatar

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:






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

Wolfgang

#3 Xobor-Superklick in der Iconbar: Erweiterung mit "Schließen-Button" - Version 3 von Wolfgang 29.04.2019 06:18

avatar

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:






Bis dann und viel Spaß mit dem neuen Skript!

Wolfgang

#4 Xobor-Superklick in der Iconbar: Erweiterung mit "Schließen- und Move-Button" - Version 4 von Wolfgang 01.05.2019 01:47

avatar

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:






Bis dann und viel Spaß mit dem neuen Skript!

Wolfgang

#5 Xobor-Superklick mit Titelleiste - Version 5 von Wolfgang 04.05.2019 09:00

avatar

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

#6 Xobor-Superklick mit Randbegrenzung! von Wolfgang 04.11.2019 20:43

avatar

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

#7 Xobor-Superklick mit gegenseitiger Auslösung! von Wolfgang 08.11.2019 16:50

avatar

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:







Viel Spaß

Wolfgang

#8 Aktualisiert: Xobor-Superklick in der Iconbar: Version 1-5 von Wolfgang 25.09.2021 15:59

avatar

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:






Bis dann
Wolfgang


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 €
143%
 
Xobor Forum Software von Xobor