Zijpaneel

Ja ik weet het, weer een vraag c: Ik was wat aan het rondkijken op enkele forums en toen kwam ik een zijpaneel (infobox) tegen zoals in de spoiler. Ik vond het echt mooi gedaan dus ik probeerde wat uit maar ik vind de juiste codes hiervoor niet, kan iemand mij helpen? Alvast bedankt!

Spoiler:

Maak een nieuw javascriptje aan. Selecteer 'Alle pagina`s' (andere optie kan ook) en plaats daar deze code:

Code:

jQuery(document).ready(function() { jQuery('body').append('<table style="position: fixed; bottom: 50px; left: 0px;background-color: #DBAE6D; border: 1px solid black;z-index:10000;"><tr><td><div id="panneau" scrolling="no" style="width: 0px; height: 0px; display: none;" marginwidth="0" marginheight="0" frameborder="0">

<div id="widgetmain" style="text-align:left;overflow-y:auto;overflow-x:hidden;width:400px;background-color:#transparent; border:0px solid #333333;">

INHOUD

</div></td><td style="vertical-align: bottom;"><img src="http://icons.iconarchive.com/icons/oxygen-icons.org/oxygen/32/Actions-arrow-right-icon.png" onClick="document.getElementById(\'panneau\').style.display=(this.src==\'http://icons.iconarchive.com/icons/oxygen-icons.org/oxygen/32/Actions-arrow-right-icon.png\')?\'block\':\'none\';this.src=(this.src==\'http://icons.iconarchive.com/icons/oxygen-icons.org/oxygen/32/Actions-arrow-right-icon.png\')?\'http://icons.iconarchive.com/icons/oxygen-icons.org/oxygen/32/Actions-arrow-left-icon.png\':\'http://icons.iconarchive.com/icons/oxygen-icons.org/oxygen/32/Actions-arrow-right-icon.png\';"/>
</td></tr></table>'); } );

Kleuren e.d. en de iconen zal je zelf aan moeten passen naar je eigen smaak. Ook de inhoud met verschillende vakken zul je zelf ik elkaar moeten zetten. Hopelijk heb je er wat aan. =D

PS: Een kleine fout in het veranderen van de iconen kan fataal zijn voor de code.

Deze code had ik al maar toch bedankt. Ik ben vooral opzoek naar een code voor die vakjes c:

Dat is een table code ;)Die van Perished is volgens mij ongeveer zo opgebouwd:

Code:

<table border="2" style="width: 100%;">
<tbody>
<tr>
                                                                                     <td style="width: 66%;">CONTENT</td><td style="width: 33%;">Content</td>
</tr>
<tr>
<td style="width: 25%;">CONTENT</td><td style="width: 75%;">CONTENT</td><td style="width: 25%;">CONTENT</td>
</tr>
</tbody>
</table>

Je moet zelf maar even spelen met de marges.

Bedankt voor de code CCDragon, ik heb wat uitgeprobeerd en bij het minste foutje verdwijnt heel het zijpaneel dus het is goed opletten maar tot nu lukt het toch al redelijk. Alleen wat is de code om zo een rij naar beneden te gaan?

Bij een een table code staat [td] voor een verticale lijn en [tr] voor een horizontale lijn. Dus als je nog een 3e rij wil hebben moet je dus eerst een nieuwe [tr] openen en dan het aantal blokken maken dat je wil dmv [td]. Ben je klaar met je rij, sluit dan weer met [tr]. Hoop dat je me een beetje begrijpt? D:

@Okaido: O, weet zo even niet waar dat aan kan liggen :/ Javascripts geactiveerd enzo?