Forensis Virtualis: HTML für klick/klappbare Seitenleiste

Mittwoch, 10. Oktober 2018

HTML für klick/klappbare Seitenleiste

Ich aktualisiere gerade das Blog, dabei fallen einige alte Inhalte weg. Hier möchte ich allerdings ein Script aufbewahren, dass immer recht nett war: eine aufklappbare Seitenleiste mit "Untermenüs", also ein klappbare Linkliste für die Blogspot-Blogs. Einfach im Layout/Design einen HTML Block einsetzen, und dieses Script verwenden (die Link-Inhalte natürlich individuell anpassen):




<style type="text/css"><!--
 .subm {padding-left:3px;}
//--></style>

<script language="JavaScript" type="text/javascript"><!--
function show(start,ende) { if(document.getElementById) {
  if(document.getElementById("subm"+start).style.display == 'inline') { hide(start,ende); }
  else { for(i=start; i<ende+1; i++) { document.getElementById('subm'+i).style.display = 'inline'; } } } }
function hide(start,ende) { 
  if(document.getElementById('subm'+start).style.display == 'none') { show(start,ende); }
  else { for(i=start; i<ende+1; i++) { document.getElementById('subm'+i).style.display = 'none'; } } }
--></script>

<b><a href="javascript:hide(101,107);">ר Friends & Projects</a></b><br/>
<div id="subm101" style="display:none"><div class="subm"><a href="http://www.debiler-leben.de.gg/">♥ debiler-leben.de.gg</a></div></div>
<div id="subm102" style="display:none"><div class="subm"><a href="http://kassandra-irrealewelt.blogspot.com/">♥ Kassandra's Irreale Welt</a></div></div>  
<div id="subm103" style="display:none"><div class="subm"><a href="http://www.momentos-sinceros.de.gg/">♥ Momentos Sinceros</a></div></div>  
<div id="subm104" style="display:none"><div class="subm"><a href="http://prinzgoliath.blogspot.com/">♥ Prinz Goliath</a></div></div>  
<div id="subm105" style="display:none"><div class="subm"><a href="http://nilsisblog.blogspot.com/">♥ Nilsi's Blog</a></div></div>  
<div id="subm106" style="display:none"><div class="subm"><a href="http://www.wir-in-guetersloh.de.gg/">♥ Wir in GT</a></div></div>  
<div id="subm107" style="display:none"><div class="subm"><a href="http://schoen-heits-farm.blogspot.com/">♥ schoen-heits-farm</a></div></div>  

<!-- ####### -->

<b><a href="javascript:hide(201,299);">ר Photo & Video</a></b><br/>
<div id="subm201" style="display:none"><div class="subm"><a href="http://www.youtube.com/profile_play_list?user=forentube">Φ youtube: forentube</a></div></div>
<div id="subm202" style="display:none"><div class="subm"><a href="http://picasaweb.google.com/forengeist">Φ picasa: forengeist</a></div></div>  
<div id="subm203" style="display:none"><div class="subm"><a href="http://de.sevenload.com/mitglieder/wir-in-gt">Φ sevenload: wiringt</a></div></div>  
<div id="subm204" style="display:none"><div class="subm"><a href="http://www.flickr.com/photos/baer_chi/">Φ flickr: baer_chi</a></div></div>  
<div id="subm205" style="display:none"><div class="subm"><a href="http://www.flickr.com/photos/baerchn/">Φ flickr: baerchn</a></div></div>  
<div id="subm206" style="display:none"><div class="subm"><a href="http://www.fotocommunity.de/pc/pc/mypics/844487">Φ Kassi's FotoCommunity</a></div></div>  
<div id="subm207" style="display:none"><div class="subm"><a href="http://shop.posterxxl.com/cgi-bin/xps_shop_poster.cgi?xps=0711261404">Φ KassaForens Poster</a></div></div>  
<div id="subm250" style="display:none"><div class="subm"><hr/></div></div>  
<div id="subm251" style="display:none"><div class="subm"><a href="http://www.flickr.com/badge.gne">- flickr badge</a></div></div>  
<div id="subm252" style="display:none"><div class="subm"><a href="http://www.picnik.com">- picnik.com</a></div></div>  
<div id="subm253" style="display:none"><div class="subm"><a href="http://www.fotoflexer.com">- fotoflexer</a></div></div>  
<div id="subm254" style="display:none"><div class="subm"><a href="http://www.slide.com">- slide.com</a></div></div>  
<div id="subm255" style="display:none"><div class="subm"><a href="http://www.save.tv">- save.tv</a></div></div>  

<!-- ####### -->

<b><a href="javascript:hide(301,315);">ר Online Office</a></b><br/>
<div id="subm301" style="display:none"><div class="subm"><a href="http://www.google.de/ig?hl=de">> I-Google</a></div></div>
<div id="subm302" style="display:none"><div class="subm"><a href="http://mail.google.com/mail">>> Google Mail</a></div></div>
<div id="subm303" style="display:none"><div class="subm"><a href="http://www.google.com/calendar">>> Google Kalender</a></div></div>
<div id="subm304" style="display:none"><div class="subm"><a href="http://www.google.com/reader/">>> Google Reader</a></div></div>
<div id="subm305" style="display:none"><div class="subm"><a href="https://webmailcluster.1und1.de/">>> 1&1 WebMail</a></div></div>

<div id="subm306" style="display:none"><div class="subm"><a href="http://www.facebook.com">> facebook.com</a></div></div>
<div id="subm307" style="display:none"><div class="subm"><a href="http://www.gmx.de">> gmx.de</a></div></div>
<div id="subm308" style="display:none"><div class="subm"><a href="http://www.web.de">> web.de</a></div></div>
<div id="subm309" style="display:none"><div class="subm"><a href="http://www.freenet.de">> freenet</a></div></div>
<div id="subm310" style="display:none"><div class="subm"><a href="http://www.yahoo.de">> yahoo</a></div></div>

<div id="subm311" style="display:none"><div style="padding-top:3px;" class="subm"><a href="http://www.eBuddy.com">> Msg eBuddy</a></div></div>
<div id="subm312" style="display:none"><div class="subm"><a href="http://www.meebo.com">> Msg meebo</a></div></div>

<div id="subm313" style="display:none"><div class="subm"><a href="http://www.pfingo.com">> Tel & Msg. pfingo.com</a></div></div>
<div id="subm314" style="display:none"><div class="subm"><a href="http://www.debitel-light.de">> Tel debitel-light.de</a></div></div>
<div id="subm315" style="display:none"><div class="subm"><a href="http://www.blau.de">> Tel blau.de</a></div></div>


<!-- ####### -->

<b><a href="javascript:hide(401,407);">ר WebTools & Scripts</a></b><br/>
<div id="subm401" style="display:none"><div class="subm"><a href="http://de.wikipedia.org/wiki/Benutzer:1001/Sonderzeichen_und_Entit%C3%A4ten">Ξ 1000 Sonderzeichen</a></div></div>
<div id="subm402" style="display:none"><div class="subm"><a href="http://www.opinionatedgeek.com/DotNet/Tools/HTMLEncode/Encode.aspx">Ξ HTML Encoder</a></div></div>
<div id="subm403" style="display:none"><div class="subm"><a href="http://www.bitteklickensiehier.de/webseiten/_blogstuff/forengeist/media-converter.html">Ξ Media Converter</a></div></div>
<div id="subm404" style="display:none"><div class="subm"><a href="http://www.feeddigest.com/">Ξ FeedDigestl</a></div></div>
<div id="subm405" style="display:none"><div class="subm"><a href="http://www.drawanywhere.com/">Ξ DrawAnyWhere</a></div></div>
<div id="subm406" style="display:none"><div class="subm"><a href="http://docx-converter.com/">Ξ DocXConverter</a></div></div>
<div id="subm407" style="display:none"><div class="subm"><a href="http://www.tinyurl.com">Ξ TinyUrl</a></div></div>

<!-- ####### -->

<b><a href="javascript:hide(501,505);">ר Suchen & Nachgucken</a></b><br/>
<div id="subm501" style="display:none"><div class="subm"><a href="http://www.dasoertliche.de/e">> Tel: DasOertliche</a></div></div>
<div id="subm502" style="display:none"><div class="subm"><a href="http://www.11880.com/">> Tel: 11880</a></div></div>
<div id="subm503" style="display:none"><div class="subm"><a href="http://dict.leo.org">> D/E Wörterbuch</a></div></div>
<div id="subm504" style="display:none"><div class="subm"><a href="http://books.google.com/books?hl=de">> Google Books</a></div></div>
<div id="subm505" style="display:none"><div class="subm"><a href="http://www.postleitzahl.org/">> postleitzahl.org</a></div></div>

<!-- ####### -->

<b><a href="javascript:hide(601,611);">ר Musik & Radio</a></b><br/>
<div id="subm601" style="display:none"><div class="subm"><a href="http://www.bitteklickensiehier.de/webseiten/_blogstuff/forengeist/ringtones/">Ω Ringtones</a></div></div>   
<div id="subm602" style="display:none"><div class="subm"><a href="http://yp.shoutcast.com/directory/index.phtml">Ω Radios: shoutcast.com</a></div></div>
<div id="subm603" style="display:none"><div class="subm"><a href="http://www.ndr2.de/pages_special_lib/0,3322,SPM9296,00.html">Ω Radio GT</a></div></div>
<div id="subm604" style="display:none"><div class="subm"><a href="http://www1.ndr2.de/pages_special_lib/0,3322,SPM7078,00.html">Ω Radio NDR2</a></div></div>  
<div id="subm605" style="display:none"><div class="subm"><a href="http://www.wdr.de/radio/wdr2/musik/playlist.phtml">Ω Radio WDR2</a></div></div>  
<div id="subm606" style="display:none"><div class="subm"><a href="http://www.starlight-media.de/radioefr/">Ω Radio EFR</a></div></div>  
<div id="subm607" style="display:none"><div class="subm"><a href="http://www.rmnradio.de/index2.html">Ω Radio RMN</a></div></div>  
<div id="subm608" style="display:none"><div class="subm"><a href="http://www.phonostar.de/">Ω phonostar.de</a></div></div>  
<div id="subm609" style="display:none"><div class="subm"><a href="http://www.mpex.net/">Ω mpex.net</a></div></div>  
<div id="subm610" style="display:none"><div class="subm"><a href="http://www.musopen.com/music.html">Ω musopen.com</a></div></div>   
<div id="subm611" style="display:none"><div class="subm"><a href="http://www.laut.de/">Ω laut.de</a></div></div>   

<!-- ####### -->

<b><a href="javascript:hide(701,705);">ר Bookmarks</a></b><br/>
<div id="subm701" style="display:none"><div class="subm"><a href="http://www.google.com/bookmarks/">> Google Bookmarks</a></div></div>
<div id="subm702" style="display:none"><div class="subm"><a href="http://my.foxmarks.com/">> foxmarks.com</a></div></div>  
<div id="subm703" style="display:none"><div class="subm"><a href="http://terese.linkarena.com/linklist">> linkarena</a></div></div>  
<div id="subm704" style="display:none"><div class="subm"><a href="http://www.mister-wong.de/user/Forengeist/">> mister-wong.de</a></div></div>  
<div id="subm705" style="display:none"><div class="subm"><a href="http://del.icio.us/forengeist?setcount=50">> del.icio.us</a></div></div>



Keine Kommentare: