Obsidian Portal
Menu
Sign In / Create Account
JavaScript is currently disabled. Obsidian Portal has a lot of really cool features that use JavaScript. You should check them out. We think you'll have a much more enjoyable experience.
Home
Campaigns
Games Nearby
Plans
Community
Help
Resources
Marvel Heroic Roleplaying
Author:
cczernia
Slug:
MHR
System:
Marvel Heroic Roleplaying
DST Source Code
HTML Template
<div class="MHR"> <div class="tabs"> <div class="clicktab1">Crunch</div> <div class="clicktab2">Description</div> </div> <div class="tab1 active"> <div class="section name"> <div class="leftbar" style="margin-top:4px"> Name: </div> <span class="dsf dsf_name">Enter Name</span> </div> <div class="section affiliations"> <div class="leftbar"> Affiliations: </div> <div class="content"> Solo: <span class="dsf dsf_MHRsolo"> </span> Buddy: <span class="dsf dsf_MHRbuddy"> </span> Team: <span class="dsf dsf_MHRteam"> </span> </div> </div> <div class="section distinctions"> <div class="leftbar"> Distinctions: </div> <div class="content"> <table> <tr><td><span class="dsf dsf_MHRdist1"></span></td> <td rowspan="3" style=" text-align:center; width:25%; font-size:24px; font-weight:bold">d4 +1pp <br /> or d8</td></tr> <tr><td><span class="dsf dsf_MHRdist2"></span></td></tr> <tr><td><span class="dsf dsf_MHRdist3"></span></td></tr> </table> </div> </div> <div class="section powersets"> <div class="leftbar"> Power Sets: </div> <div class="content"> <table class="PowerSet1"> <tr><td colspan="2" class="PSheader"><span class="dsf dsf_MHR_PS1_title">My Sweet Power</span></td></tr> <tr> <td><span class="dsf dsf_MHR_PS1_Pow1"></span><span class="dsf powval dsf_ dsf_MHR_PS1_Pow1_val"> </span></td> <td><span class="dsf dsf_MHR_PS1_Pow2"></span><span class="dsf powval dsf_ dsf_MHR_PS1_Pow2_val"> </span></td> </tr> <tr> <td><span class="dsf dsf_MHR_PS1_Pow3"></span><span class="dsf powval dsf_ dsf_MHR_PS1_Pow3_val"> </span></td> <td><span class="dsf dsf_MHR_PS1_Pow4"></span><span class="dsf powval dsf_ dsf_MHR_PS1_Pow4_val"> </span></td> </tr> <tr> <td><span class="dsf dsf_MHR_PS1_Pow5"></span><span class="dsf powval dsf_ dsf_MHR_PS1_Pow5_val"> </span></td> <td><span class="dsf dsf_MHR_PS1_Pow6"></span><span class="dsf powval dsf_ dsf_MHR_PS1_Pow6_val"> </span></td> </tr> <tr><td colspan="2" class="SFX"> <p><span class="dsf dsf_MHR_PS1_SFX1"> </span></p> <p><span class="dsf dsf_MHR_PS1_SFX2"> </span></p> <p><span class="dsf dsf_MHR_PS1_SFX3"> </span></p> <p><span class="dsf dsf_MHR_PS1_SFX4"> </span></p> <p><span class="dsf dsf_MHR_PS1_SFX5"> </span></p> <p><span class="dsf dsf_MHR_PS1_SFX6"> </span></p></td></tr> </table> <table class="PowerSet2"> <tr><td colspan="2" class="PSheader"><span class="dsf dsf_MHR_PS2_title"></span> </td></tr> <tr> <td><span class="dsf dsf_MHR_PS2_Pow1"> </span><span class="dsf powval dsf_ dsf_MHR_PS2_Pow1_val"> </span></td> <td><span class="dsf dsf_MHR_PS2_Pow2"> </span><span class="dsf powval dsf_ dsf_MHR_PS2_Pow2_val"> </span></td> </tr> <tr> <td><span class="dsf dsf_MHR_PS2_Pow3"> </span><span class="dsf powval dsf_ dsf_MHR_PS2_Pow3_val"> </span></td> <td><span class="dsf dsf_MHR_PS2_Pow4"> </span><span class="dsf powval dsf_ dsf_MHR_PS2_Pow4_val"> </span></td> </tr> <tr> <td><span class="dsf dsf_MHR_PS2_Pow5"> </span><span class="dsf powval dsf_ dsf_MHR_PS2_Pow5_val"> </span></td> <td><span class="dsf dsf_MHR_PS2_Pow6"> </span><span class="dsf powval dsf_ dsf_MHR_PS2_Pow6_val"> </span></td> </tr> <tr><td colspan="2" class="SFX"><span class="dsf dsf_MHR_PS2_SFX1"> </span></p> <p><span class="dsf dsf_MHR_PS2_SFX2"> </span></p> <p><span class="dsf dsf_MHR_PS2_SFX3"> </span></p> <p><span class="dsf dsf_MHR_PS2_SFX4"> </span></p> <p><span class="dsf dsf_MHR_PS2_SFX5"> </span></p> <p><span class="dsf dsf_MHR_PS2_SFX6"> </span></p></td></tr> </table> <table class="PowerSet3"> <tr><td colspan="2" class="PSheader"><span class="dsf dsf_MHR_PS3_title"></span> </td></tr> <tr> <td><span class="dsf dsf_MHR_PS3_Pow1"> </span><span class="dsf powval dsf_ dsf_MHR_PS3_Pow1_val"> </span></td> <td><span class="dsf dsf_MHR_PS3_Pow2"> </span><span class="dsf powval dsf_ dsf_MHR_PS3_Pow2_val"> </span></td> </tr> <tr> <td><span class="dsf dsf_MHR_PS3_Pow3"> </span><span class="dsf powval dsf_ dsf_MHR_PS3_Pow3_val"> </span></td> <td><span class="dsf dsf_MHR_PS3_Pow4"> </span><span class="dsf powval dsf_ dsf_MHR_PS3_Pow4_val"> </span></td> </tr> <tr> <td><span class="dsf dsf_MHR_PS3_Pow5"> </span><span class="dsf powval dsf_ dsf_MHR_PS3_Pow5_val"> </span></td> <td><span class="dsf dsf_MHR_PS3_Pow6"> </span><span class="dsf powval dsf_ dsf_MHR_PS3_Pow6_val"> </span></td> </tr> <tr><td colspan="2" class="SFX"> <p><span class="dsf dsf_MHR_PS3_SFX1"> </span></p> <p><span class="dsf dsf_MHR_PS3_SFX2"> </span></p> <p><span class="dsf dsf_MHR_PS3_SFX3"> </span></p> <p><span class="dsf dsf_MHR_PS3_SFX4"> </span></p> <p><span class="dsf dsf_MHR_PS3_SFX5"> </span></p> <p><span class="dsf dsf_MHR_PS3_SFX6"> </span></p></td></tr> </table> </div> </div> <div class="section specialties"> <div class="leftbar"> Specialties: </div> <div class="content"> <table> <tr> <td><span class="dsf dsf_MHR_spec1"> </span><span class="dsf powval dsf_ dsf_MHR_spec1_val"> </span></td> <td><span class="dsf dsf_MHR_spec2"> </span><span class="dsf powval dsf_ dsf_MHR_spec2_val"> </span></td> </tr> <tr> <td><span class="dsf dsf_MHR_spec3"> </span><span class="dsf powval dsf_ dsf_MHR_spec3_val"> </span></td> <td><span class="dsf dsf_MHR_spec4"> </span><span class="dsf powval dsf_ dsf_MHR_spec4_val"> </span></td> </tr> <tr> <td><span class="dsf dsf_MHR_spec5"> </span><span class="dsf powval dsf_ dsf_MHR_spec5_val"> </span></td> <td><span class="dsf dsf_MHR_spec6"> </span><span class="dsf powval dsf_ dsf_MHR_spec6_val"> </span></td> </tr> </table> </div> </div> <div class="section milestones"> <div class="leftbar"> Milestones: </div> <div class="content"> <table> <tr><td class="MSheader" colspan="2"><span class="dsf dsf_MHR_ms1_title"> </span> </td></tr> <tr> <td width="10%">1 XP</td> <td><span class="dsf dsf_MHR_ms1_1xp"></span></td> </tr> <tr> <td>3 XP</td> <td><span class="dsf dsf_MHR_ms1_3xp"></span></td> </tr> <tr> <td>10 XP</td> <td><span class="dsf dsf_MHR_ms1_10xp"></span></td> </tr> </table> <table> <tr><td class="MSheader" colspan="2"><span class="dsf dsf_MHR_ms2_title"></span> </td></tr> <tr> <td width="10%">1 XP</td> <td><span class="dsf dsf_MHR_ms2_1xp"></span></td> </tr> <tr> <td>3 XP</td> <td><span class="dsf dsf_MHR_ms2_3xp"></span></td> </tr> <tr> <td>10 XP</td> <td><span class="dsf dsf_MHR_ms2_10xp"></span></td> </tr> </table> </div> </div> </div> <div class="tab2"> <div class="section extrainfo"> <div class="leftbar"> Extra Info: </div> <div class="content"> <table> <tr> <td><strong>Player Name:</strong> <span class="dsf dsf_player"></span></td> </tr> <tr> <td><strong>Campaign Name:</strong> <span class="dsf dsf_campaign"></span></td> </tr> <tr> <td><strong>Bio:</strong> <span class="dsf dsf_avatar_image"></span> <span class="dsf dsf_bio"></span> </td> </tr> </table> <span style="font-size:8px;">DST Author:<span class="dsf dsf_dst_author"></span></span> </div> </div> </div> </div>
CSS
.MHR {background-color:#003366; width:730px; padding: 0 5px 5px 5px; font-family:georgia,times,"times new roman",serif; font-size:14px;} .dsf {min-height:15px; min-width:20px;} .section { padding:10px 0 5px 0; margin:15px 0; position:relative} .leftbar {width:115px; font-size:18px; font-weight:bold; color:#FFF; font-family:Arial, Helvetica, sans-serif; text-align:right; float:left; margin-right:2px; height:100%} .content {margin-left: 117px;} .dsf_name {font-size:24px; color:#ccc} .affiliations .content {font-weight:bold; font-size:20px; color:#ccc} .affiliations .content span {font-weight:normal; margin-right:30px; height:25px; width:32px; display:inline-bloc; background-color:#fff; color:#000} table {width:610px; border: 2px solid; color:#003366; margin-bottom:3px; border-radius:5px; } td {border: 1px #666666 solid; background-color:#fff; color:#000} .powersets td {font-weight:normal} .PSheader, .MSheader {font-size:18px} .powval, .affiliations span {font-weight:bold; width: 25px; height: 18px; text-align:center; display:inline-block; border:1px #CCC solid; border-radius: 2px} .powval {float:right;} td.SFX {font-size:13px; border:none} .dsf_avatar_image {float:right;} .tabs {width:400px; margin:0 auto} .tabs div {width:180px; border: 1px solid #666; border-top:none; display:inline-block; text-align:center; color:#FFFFFF; font-family:Arial, Helvetica, sans-serif; border-bottom-right-radius:3px; border-bottom-left-radius:3px; } .tabs div:hover {background-color:#FFFECC; cursor:pointer; color:#003366} .tab2, .tab1 {display:none} .active {display:block} .edit_game_character .dsf, .new_game_character .dsf {background-color:#FFFECC !important; min-width:10px} .edit_game_character:hover .dsf, .new_game_character .dsf:hover {cursor:pointer;}
Javascript
jQuery(document).ready(function(){ if (!document.getElementById('dst_select')){ for (i=1; i <= 3; i++) { var PS = jQuery('.dsf_MHR_PS'+i+'_title').text(); if ((PS == '') || (PS == ' ')) jQuery('.PowerSet'+i).css('display', 'none'); } } jQuery('.clicktab2').click(function() { jQuery('.tab2').addClass('active'); jQuery('.tab1').removeClass('active'); }); jQuery('.clicktab1').click(function() { jQuery('.tab1').addClass('active'); jQuery('.tab2').removeClass('active'); }); });
Submit Notes
Back
