SHARE
TWEET

sitemap

Susantokun Mar 13th, 2017 317 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. <div id="tabbed-toc">
  2. <span class="loading">Loading, please wait for a moment...</span></div>
  3. <script type="text/javascript">
  4. var tabbedTOC = {
  5.     blogUrl: "http://www.susantokun.com", // Enter your blog URL
  6.     containerId: "tabbed-toc", // Container ID
  7.     activeTab: 1, // The default active tab index (default: the first tab)
  8.     showDates: false, // `true` to show the post date
  9.     showSummaries: false, // `true` to show the posts summaries
  10.     numChars: 200, // Number of summary chars
  11.     showThumbnails: false, // `true` to show the posts thumbnails (Not recommended)
  12.     thumbSize: 40, // Default thumbnail size
  13.     noThumb: "", // A "no thumbnail" URL
  14.     monthNames: [ // Array of month names
  15.         "January",
  16.         "February",
  17.         "March",
  18.         "April",
  19.         "May",
  20.         "June",
  21.         "July",
  22.         "August",
  23.         "September",
  24.         "October",
  25.         "November",
  26.         "December"
  27.     ],
  28.     newTabLink: true, // Open link in new window. `false` to open in same window
  29.     maxResults: 99999, // Maximum post results
  30.     preload: 0, // Load the feed after 0 seconds (option => time in milliseconds || "onload")
  31.     sortAlphabetically: true, // `false` to sort posts by published date
  32.     showNew: 7, // `false` to hide the "New!" mark in most recent posts or
  33.  //define how many recent posts are to be marked by changing the number
  34.     newText: " - <em style='color: white;padding: 1px 5px;border-radius: 20px;background-color: #F00;'>New!</em>" // HTML/CSS for
  35. //the "New!" text
  36. };
  37. </script>
  38. <script src="https://rawgit.com/susantokun/blogger/master/sitemaptabbed.js" type="text/javascript"></script>
  39. <style>
  40. /*Sitemap  */
  41. #tabbed-toc {
  42.  width: 99%;
  43.  margin: 0 auto;
  44.  overflow: hidden !important;
  45.  position: relative;
  46.  color: #222;
  47.  border: 0;
  48.  border-top: 5px solid #007ABE;
  49.  background-color: #fff;
  50.  -webkit-transition: all 0.4s ease-in-out;
  51. }
  52. #tabbed-toc .loading {
  53.  display:block;
  54.  padding:5px 15px;
  55.  font:normal bold 11px Arial,Sans-Serif;
  56.  color:#FFF;
  57. }
  58. #tabbed-toc ul,
  59. #tabbed-toc ol,
  60. #tabbed-toc li {
  61.  margin:0;
  62.  padding:0;
  63.  list-style:none;
  64.  }
  65. #tabbed-toc .toc-tabs {
  66.  width: 24.8%;
  67.  float: left !important;
  68. }
  69. #tabbed-toc .toc-tabs li a {
  70.  display:block;
  71.  font:normal bold 10px/28px Arial,Sans-Serif;
  72.  height:28px;
  73.  overflow:hidden;
  74.  text-overflow:ellipsis;
  75.  color:#007ABE;
  76.  text-transform:uppercase;
  77.  text-decoration:none;
  78.  padding:0 12px;
  79.  cursor:pointer;
  80.   -webkit-transition: all 0.3s ease-in-out;
  81. }
  82. #tabbed-toc .toc-tabs li a:hover {
  83.  background-color: #515050;
  84.  color: #FFF;
  85.  }
  86. #tabbed-toc .toc-tabs li a.active-tab {
  87.  background-color: #007ABE;
  88.  color: #fff;
  89.  position: relative;
  90.  z-index: 5;
  91.  margin: 0 -2px 0 0;
  92. }
  93. #tabbed-toc .toc-content,
  94. #tabbed-toc .divider-layer {
  95.  width: 75%;
  96.  float: right !important;
  97.  background-color: #F5F5F5;
  98.  border-left: 5px solid #007ABE;
  99.  -webkit-box-sizing: border-box;
  100.  -moz-box-sizing: border-box;
  101.  box-sizing: border-box;
  102.  -webkit-transition: all 0.3s ease-in-out;
  103. }
  104. #tabbed-toc .divider-layer {
  105.  float:none;
  106.  display:block;
  107.  position:absolute;
  108.  top:0; right:0; bottom:0;
  109. }
  110. #tabbed-toc .panel {
  111.  position:relative;
  112.  z-index:5;
  113.  font:normal normal 10px Arial,Sans-Serif;
  114. }
  115. #tabbed-toc .panel li a {
  116.  display: block;
  117.  position: relative;
  118.  font-weight: bold;
  119.  font-size: 11px;
  120.  color: #222;
  121.  line-height: 2.8em;
  122.  height: 30px;
  123.  padding: 0 10px;
  124.  text-decoration: none;
  125.  outline: none;
  126.  overflow: hidden;
  127.  -webkit-transition: all 0.3s ease-in-out;
  128. }
  129. #tabbed-toc .panel li time {
  130.  display:block;
  131.  font-style:italic;
  132.  font-weight:400;
  133.  font-size:10px;
  134.  color:#666;
  135.  float:right;
  136. }
  137. #tabbed-toc .panel li .summary {
  138.  display:block;
  139.  padding:10px 12px;
  140.  font-style:italic;
  141.  border-bottom:4px solid #275827;
  142.  overflow:hidden;
  143. }
  144. #tabbed-toc .panel li .summary img.thumbnail {
  145.  float:left;
  146.  display:block;
  147.  margin:0 8px 0 0;
  148.  padding:4px;
  149.  width:72px;
  150.  height:72px;
  151.  border:1px solid #dcdcdc;
  152.  background-color:#fafafa;
  153. }
  154. #tabbed-toc .panel li:nth-child(even) {
  155.  background-color: #DBDBDB;
  156.  font-size: 10px;
  157. }
  158. #tabbed-toc .panel li a:hover,
  159. #tabbed-toc .panel li a:focus,
  160. #tabbed-toc .panel li a:hover time,
  161. #tabbed-toc .panel li.bold a {
  162.  background-color:#222;
  163.  color:#FFF;
  164.  outline:none;
  165.  -webkit-transition: all 0.3s ease-in-out;
  166. }
  167. #tabbed-toc .panel li.bold a:hover,
  168. #tabbed-toc .panel li.bold a:hover time {
  169.  background-color:#222;
  170. }
  171. @media (max-width:700px) {
  172. #tabbed-toc {
  173.  background-color:#fff;
  174.  border:0 solid #888;
  175. }
  176. #tabbed-toc .toc-tabs,
  177. #tabbed-toc .toc-content {
  178.  overflow:hidden;
  179.  width:auto;
  180.  float:none !important;
  181.  display:block;
  182. }
  183. #tabbed-toc .toc-tabs li {
  184.  display:inline;
  185.  float:left !important;
  186. }
  187. #tabbed-toc .toc-tabs li a,
  188. #tabbed-toc .toc-tabs li a.active-tab {
  189.  background-color:#222;
  190.  color:#ccc;
  191. }
  192. #tabbed-toc .toc-tabs li a.active-tab {
  193.  color:#000;
  194. }
  195. #tabbed-toc .toc-content {
  196.  border:none;
  197. }
  198. #tabbed-toc .divider-layer,
  199. #tabbed-toc .panel li time {
  200.  display:none;
  201. }
  202. }
  203. </style>
RAW Paste Data
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy. OK, I Understand
 
Top