Forum - Xobor-Spoiler mit Grafik in der Titelleiste

[spoiler4={{Bild}}={{Titel}}]
...
[/spoiler4]
 

<div class="hpm_spoiler hpm_spoiler4"><div class="hpm_spoiler_headdiv"><img class="spoiler_bild" src="{{Bild}}"><input type="button" onclick="hpm_spoiler(this.parentNode.parentNode);" class="hpm_spoiler_headinput hpm_spoiler_closed" value="{{Titel}}"></div><div><div class="hpm_spoiler_body"><div style="padding: 10px;"><img class="spoiler_bild_in" src="{{Bild}}">
...
</div><div class="hpm_spoiler_closebutton"><a title="Spoiler schließen!" href="javascript:void(0);" onclick="hpm_spoiler(this.parentNode.parentNode.parentNode.parentNode);">Schließen</a></div></div></div></div>
 

//img.homepagemodules.de/ds/static/gaia/eye--plus.png
 

Reihenfolge: 0
 

/* Xobor-Spoiler mit Grafik */
.hpm_spoiler4 .spoiler_bild  {
object-fit: cover; 
position:absolute; 
margin:-15px 0 0 22px; 
padding:2px 4px 4px 4px; 
max-width:100px; 
height:40px; 
border:2px solid #777777; 
background:#eeeeee; 
border-radius:5px 5px 0 0;
}
.hpm_spoiler4 .spoiler_bild_in {
display:block;
object-fit: cover; 
max-width:100px; 
max-height:10px; 
margin:0 10px 10px 0;
}
.hpm_spoiler4 .hpm_spoiler_headinput {
padding-left: 70px;
}
.hpm_spoiler4 .hpm_spoiler_headdiv {
margin-top:40px; 
position:relative;
}
 

<div onclick="xob_insert(`[spoiler4= https://www.Bild-Adresse.de = Text Spoiler-Titelleiste]Der Text zur inneren Grafik`,`\n\n[/spoiler4]`)" class="xob_icon_cont" id="icon_1101"><img alt="[spoiler4][/spoiler4]" title="Spoiler mit Grafik einfügen" class="xob_icon" src="//img.homepagemodules.de/ds/static/gaia/eye--plus.png"></div>
 

[spoiler4={{Bild}}={{Titel}}]
...
[/spoiler4]
 

<div class="hpm_spoiler hpm_spoiler4"><div class="hpm_spoiler_headdiv"><img class="spoiler_bild" src="{{Bild}}"><input type="button" onclick="hpm_spoiler(this.parentNode.parentNode);" class="hpm_spoiler_headinput hpm_spoiler_closed" value="{{Titel}}"></div><div><div class="hpm_spoiler_body"><div style="padding: 10px;"><img class="spoiler_bild_in" src="{{Bild}}">
...
</div><div class="hpm_spoiler_closebutton"><a title="Spoiler schließen!" href="javascript:void(0);" onclick="hpm_spoiler(this.parentNode.parentNode.parentNode.parentNode);">Schließen</a></div></div></div></div>
 

//img.homepagemodules.de/ds/static/gaia/eye--plus.png
 

Reihenfolge: 0
 

/* Xobor-Spoiler mit Grafik */
.hpm_spoiler4 .spoiler_bild {
object-fit: cover; 
position:absolute; 
margin:-5px 0 0 20px; 
max-width:30px; 
height:30px; 
}
.hpm_spoiler4 .spoiler_bild_in {
object-fit: cover; 
height:70px; 
margin:0 10px 5px 0;
}
.hpm_spoiler4 .hpm_spoiler_headinput {
padding-left: 55px;
}
.hpm_spoiler4 .hpm_spoiler_headdiv {
padding:8px 0;
position:relative;
}
 

<div onclick="xob_insert(`[spoiler4= https://www.Bild-Adresse.de = Text Spoiler-Titelleiste]Der Text zur inneren Grafik`,`\n\n[/spoiler4]`)" class="xob_icon_cont" id="icon_1101"><img alt="[spoiler4][/spoiler4]" title="Spoiler mit Grafik einfügen" class="xob_icon" src="//img.homepagemodules.de/ds/static/gaia/eye--plus.png"></div>
 

[neu]
...
[/neu]
 

<div style="display:flex;"><img style="align-self: flex-end; margin:0 10px 10px 0;" src="//files.homepagemodules.de/b104774/a_54_8b2941f5.gif">
...
</div>
 

//files.homepagemodules.de/b2001010/a_800_4ec558a8.png
 

Reihenfolge: 0