Verbesserungsvorschl�ge » Code-Tabellen, Spoiler und Pre otimaler anzeigen!

Code-Tabellen, Spoiler und Pre otimaler anzeigen!

03.11.2017 19:20 (zuletzt bearbeitet: 03.11.2017 19:26)

Wolfgang
#1 Code-Tabellen, Spoiler und Pre otimaler anzeigen!

Ich nutze oft den Xobor-Spoiler, um Beiträge übersichtlich zu gestalten!
Es kommt auch vor, dass mehrere Spoiler ineinander verschachtelt werden!
Fügt man obendrein auch noch Code- oder Pre-Tabellen hinzu, reicht die normale Formatierung nicht aus!
Code- oder Pre-Tabellen werden dann umgebrochen, über den Spoilerrand geschrieben oder das Ende der Tabelle wird abgeschnitten!
Verändert man die Fenstergröße stellen sich weitere Probleme ein!
Auch werden die Tabellen recht kurz dargestellt (ca. 600-700px).
Ein Sonderfall ist noch die Darstellung der Tabellen und Spoiler im Profil!
Auch die Werbeeinblendung (rechts) müssen hier berücksichtigt werden!

Gibt es hier eine Lösung?

Mehr in meinem Forum:
Habe ein kleines Test-Script mit alle Eventualitäten, dass man dann in der Vorschau, im Profil, in Beiträge, mit und ohne Werbung, im Vollbild-Modus, im Fenster-Modus oder auch in unterschiedlichen Bildschirmauflösungen testen kann!

� Spoiler-Veschachtelung mit Code und Pre

Ich habe einiges ausprobiert und bin mit einfacher Formatierungen nicht weitergekommen, um alle Fälle zufriedenstellend zu lösen!

Hier mein Ansatz:
Kann zum Testen in die Kopfzeile eingefügt werden!

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
 
<style type="text/css">
.hpm_spoiler_body {margin-left:0.5%;border-color:#dddddd;border-style:double;border-width:0 5px 5px 5px;border-radius:0 0 5px 5px;width:98%;box-shadow: inset 2px 2px 4px #979489;}
.hpm_spoiler_body ul{padding-left:15px;}
.hpm_spoiler_headdiv {background-color:#eeeeee;border:1px solid #cccccc;border-radius:5px;}
.hpm_spoiler, .hpm_spoiler_headinput {width:98% !important;outline:none;}
.codelines{margin:0px !important;}
.profile {min-width:800px;}
.profile ul.xul {padding-left:15px;list-style-type: disc;}
/* Feste Breite der Benutzer-Spalte */
/* Wird unter "Admin > Layout > Farben & Einstellungen > Mitglieder Info" eingestellt */
.sidebarcontent {width:240px;}
</style>
 
<script type="text/javascript" language="JavaScript">
function refresh() {
 
//Korrektur der Breite im Profil
if( $('.profile').length ){
$(document).removeAttr('width');
var documentWidth = $('.rightcell').width()-150;
}else{
 
//Mit Werbungeinblendung rechts
if( $('#xoborAdSeiteEl').length ){
$(document).removeAttr('width');
var documentWidth = $(document).width()-790;
}else{
//Ohne Werbungeinblendung
$(document).removeAttr('width');
var documentWidth = $(document).width()-630;
};
};
 
//Korrektur bei verschiedenen Spoilerverschachtelungen
$('pre').width(documentWidth);
//einfacher Spoiler
$('.hpm_spoiler pre').width(documentWidth-50);
//Spoiler im Spoiler
$('.hpm_spoiler .hpm_spoiler pre').width(documentWidth-120);
//2-facher Verschachtelung
$('.hpm_spoiler .hpm_spoiler .hpm_spoiler pre').width(documentWidth-200);
//3-facher Verschachtelung
$('.hpm_spoiler .hpm_spoiler .hpm_spoiler .hpm_spoiler pre').width(documentWidth-270);
//4-facher Verschachtelung
$('.hpm_spoiler .hpm_spoiler .hpm_spoiler .hpm_spoiler .hpm_spoiler pre').width(documentWidth-330);
 
setTimeout(refresh,100);
};
 
$(document).ready(function(){
refresh();
});
</script>
 