bychloethemes

Pablo Picasso Theme - by Chloe

Oct 31st, 2015
1,765
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 20.47 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <head>
  3. <!------------------------------------------
  4. _ _ _
  5. | |__ _ _ ___| |__ | | ___ ___
  6. | '_ \| | | | / __| '_ \| |/ _ \ / _ \
  7. | |_) | |_| | | (__| | | | | (_) | __/
  8. |_.__/ \__, | \___|_| |_|_|\___/ \___|
  9. |___/
  10.  
  11. Pablo Picasso Theme by Chloe | @dontbrag | @bychloethemes
  12.  
  13. Do not delete the credit. Do not claim as your own. Do not copy any ideas or code. Do not redistribute.
  14.  
  15. If I find any of this anywhere me & my squad (aka @fruitelf and @costalies) will personally drag ur name thru the dirt do not test us.
  16.  
  17. For html help go to @htmlqueens
  18.  
  19. ------------------------------------------->
  20. <meta name="image:Background" content="" />
  21.  
  22. <meta name="color:Background" content="#fff"/>
  23. <meta name="color:Text" content="#000"/>
  24. <meta name="color:Accent" content="#f8b1ca" />
  25. <meta name="color:Border" content="#ffd8e6" />
  26.  
  27. <meta name="select:Columns" content="col2" title="2" />
  28. <meta name="select:Columns" content="col3" title="3" />
  29. <meta name="select:Columns" content="col4" title="4" />
  30.  
  31. <meta name="if:Tiled Background" content="0" />
  32.  
  33. <meta name="text:Link 1" content="" />
  34. <meta name="text:URL 1" content="http://" />
  35. <meta name="text:Link 2" content="" />
  36. <meta name="text:URL 2" content="http://" />
  37. <meta name="text:Link 3" content="" />
  38. <meta name="text:URL 3" content="http://" />
  39.  
  40. <meta charset="UTF-8" />
  41. <title>{block:TagPage}{Tag} posts | {/block:TagPage} {block:PostSummary}{PostSummary} | {/block:PostSummary}{Title}</title>
  42. <link rel="shortcut icon" href="{Favicon}">
  43. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  44. <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
  45. <link href="http://static.tumblr.com/wgijwsy/k1Hm9ei8b/normalize.css" rel="stylesheet" type="text/css" />
  46. <style type="text/css">
  47. #tumblr_controls {
  48. top:15px!important;
  49. right:15px!important;
  50. -webkit-filter: invert(100%);
  51. position:fixed!important;
  52. }
  53. ::-webkit-scrollbar {
  54. background-color:#fff;
  55. height: 7px;
  56. width: 7px;
  57. }
  58. ::-webkit-scrollbar-thumb {
  59. background-color:{color:Accent};
  60. border:2px solid #fff;
  61. }
  62. ::selection {
  63. background:transparent;
  64. color:{color:Accent};
  65. }
  66. ::-moz-selection {
  67. background:transparent;
  68. color:{color:Accent};
  69. }
  70. body{
  71. background:{color:background} url({image:Background})
  72. {block:IfTiledBackground}
  73. repeat fixed;
  74. {/block:IfTiledBackground}
  75. {block:IfNotTiledbackground}
  76. no-repeat center center fixed;
  77. -webkit-background-size:cover;
  78. -moz-background-size:cover;
  79. -ms-background-size:cover;
  80. -o-background-size:cover;
  81. background-size:cover;
  82. {/block:IfNotTiledbackground}
  83. color:{color:text};
  84. font-size:12px;
  85. font-family: 'Consolas', monospace;
  86. font-weight:400;
  87. }
  88. a {
  89. text-decoration:none;
  90. color:{color:Text};
  91. }
  92. iframe, img, embed, object, video {
  93. max-width: 100%;
  94. }
  95. img {
  96. height: auto;
  97. width: auto;
  98. vertical-align:middle;
  99. }
  100. #infscr-loading {
  101. position:absolute;
  102. bottom:25px;
  103. width:200px;
  104. margin-left:50%;
  105. left:-100px;
  106. text-align:center;
  107. }
  108. #top, #left, #right, #bottom {
  109. background:{color:Border};
  110. position:fixed;
  111. }
  112. #top, #bottom {
  113. height:15px;
  114. width:100%;
  115. z-index:99;
  116. left:0;
  117. }
  118. #left, #right {
  119. width:15px;
  120. height:100%;
  121. z-index:999;
  122. top:0;
  123. }
  124. #top {top:0;}
  125. #left {left:0;}
  126. #right {right:0;}
  127. #bottom {bottom:0;}
  128. #header {
  129. text-align:left;
  130. margin:0;
  131. margin-bottom:30px;
  132. z-index:999;
  133. }
  134. #header h1 {
  135. margin:0;
  136. }
  137. #header p {
  138. font-size:11px;
  139. }
  140. ul#navlinks {
  141. list-style-type:none;
  142. font-size:12px;
  143. margin: 15px 0px 5px 0px;
  144. padding:10px 0 0 0;
  145. z-index:99;
  146. text-align:left;
  147. border-top:1px solid {color:accent};
  148. }
  149. ul#navlinks li {
  150. line-height:20px;
  151. display:inline-block;
  152. text-transform:capitalize;
  153. text-align:left;
  154. margin:0 5px;
  155. position:relative;
  156. }
  157. ul#navlinks a {
  158. color:{color:text};
  159. -webkit-transition: all 0.2s ease-in-out;
  160. -moz-transition: all 0.2s ease-in-out;
  161. -o-transition: all 0.2s ease-in-out;
  162. transition: all 0.2s ease-in-out;
  163. }
  164. ul#navlinks a:hover {
  165. color:{color:accent};
  166. -webkit-transition: all 0.2s ease-in-out;
  167. -moz-transition: all 0.2s ease-in-out;
  168. -o-transition: all 0.2s ease-in-out;
  169. transition: all 0.2s ease-in-out;
  170. }
  171. #wrapper {
  172. margin-left:50%;
  173. -webkit-transform: translate(-50%, 0%);
  174. -moz-transform: translate(-50%, 0%);
  175. -ms-transform: translate(-50%, 0%);
  176. -o-transform: translate(-50%, 0%);
  177. transform: translate(-50%, 0%);
  178. margin-top:50px;
  179. {block:PermalinkPage}
  180. width:500px;
  181. {/block:PermalinkPage}
  182. }
  183. {block:IndexPage}
  184. .col2 {
  185. width:560px;
  186. }
  187. .col3 {
  188. width:870px;
  189. }
  190. .col4 {
  191. width:1180px;
  192. }
  193. {/block:IndexPage}
  194. {block:PermalinkPage}
  195. #posts {
  196. position:relative;
  197. }
  198. {/block:PermalinkPage}
  199. .credit {
  200. width:16px;
  201. height:14px;
  202. color: {color:Text};
  203. position:fixed;
  204. bottom: 25px;
  205. right: 25px;
  206. line-height: 14px;
  207. font-size:12px;
  208. padding:3px 4px;
  209. overflow: hidden;
  210. z-index:999999999999999999;
  211. text-align:left;
  212. border-bottom:1px solid {color:accent};
  213. -webkit-transition: all 0.5s ease-in-out 0.2s;
  214. -moz-transition: all 0.5s ease-in-out 0.2s;
  215. -o-transition: all 0.5s ease-in-out 0.2s;
  216. transition: all 0.5s ease-in-out 0.2s;
  217. }
  218. .credit .fa-diamond {
  219. position:absolute;
  220. right:5px;
  221. -webkit-transition: all 0.5s ease-in-out;
  222. -moz-transition: all 0.5s ease-in-out;
  223. -o-transition: all 0.5s ease-in-out;
  224. transition: all 0.5s ease-in-out;
  225.  
  226. }
  227. .credit:hover .fa-diamond {
  228. transform: rotateY(180deg);
  229. -webkit-transition: all 0.5s ease-in-out;
  230. -moz-transition: all 0.5s ease-in-out;
  231. -o-transition: all 0.5s ease-in-out;
  232. transition: all 0.5s ease-in-out;
  233. }
  234. .credit:hover {
  235. width:130px;
  236. color:{color:text};
  237. -webkit-transition: all 0.5s ease-in-out;
  238. -moz-transition: all 0.5s ease-in-out;
  239. -o-transition: all 0.5s ease-in-out;
  240. transition: all 0.5s ease-in-out;
  241. }
  242. .credit .wordy {
  243. opacity:0;
  244. visibility:hidden;
  245. -webkit-transition: all 0.2s ease-in-out;
  246. -moz-transition: all 0.2s ease-in-out;
  247. -o-transition: all 0.2s ease-in-out;
  248. transition: all 0.2s ease-in-out;
  249. }
  250. .credit:hover .wordy {
  251. opacity: 1;
  252. visibility: visible;
  253. -webkit-transition: all 0.5s ease-in-out 0.5s;
  254. -moz-transition: all 0.5s ease-in-out 0.5s;
  255. -o-transition: all 0.5s ease-in-out 0.5s;
  256. transition: all 0.5s ease-in-out 0.5s;
  257. }
  258. .credit a .wordy {
  259. color:{color:text};
  260. text-decoration: none;
  261. font-size:12px;
  262. -webkit-transition: all 0.2s ease-in-out;
  263. -moz-transition: all 0.2s ease-in-out;
  264. -o-transition: all 0.2s ease-in-out;
  265. transition: all 0.2s ease-in-out;
  266. }
  267. .credit a:hover .wordy {
  268. cursor:help;
  269. color:{color:accent};
  270. -webkit-transition: all 0.2s ease-in-out;
  271. -moz-transition: all 0.2s ease-in-out;
  272. -o-transition: all 0.2s ease-in-out;
  273. transition: all 0.2s ease-in-out;
  274. }
  275. article {
  276. margin-bottom:60px;
  277. position:relative;
  278. {block:IndexPage}
  279. width:250px;
  280. {/block:IndexPage}
  281. {block:PermalinkPage}
  282. width:500px;
  283. {/block:PermalinkPage}
  284. }
  285. article a {
  286. color:{color:Accent};
  287. }
  288. article h2 {
  289. margin:0;
  290. font-size:1.3em;
  291. font-weight:bold;
  292. }
  293. article p {
  294. margin:10px 0;
  295. }
  296. article blockquote {
  297. margin: 5px 0 5px 10px;
  298. border-left:2px solid {color:Accent};
  299. padding-left:10px;
  300. }
  301. article ul, article ol {
  302. padding-left:25px;
  303. }
  304. .photo-post {
  305. padding-bottom:3px;
  306. border-bottom:1px solid {color:accent};
  307. }
  308. .quote-post cite {
  309. text-align:right;
  310. display:block;
  311. margin:5px 5px 10px 5px;
  312. }
  313. ul.chat-list {
  314. padding:0;
  315. list-style-type:none;
  316. }
  317. ul.chat-list li {
  318. line-height:17px;
  319. }
  320. ul.chat-list .label {
  321. color:{color:Accent};
  322. }
  323. .album-art img {
  324. {block:IndexPage}
  325. width:80px;
  326. height:80px;
  327. {/block:IndexPage}
  328. float:left;
  329. margin-right:10px;
  330. {block:PermalinkPage}
  331. width:120px;
  332. height:120px;
  333. {/block:PermalinkPage}
  334. }
  335. .audio-info {
  336. {block:IndexPage}
  337. min-height:80px;
  338. {/block:IndexPage}
  339. {block:PermalinkPage}
  340. min-height:120px;
  341. line-height:140%;
  342. {/block:PermalinkPage}
  343. margin-bottom:10px;
  344. }
  345. .tumblr_audio_player {
  346. position: absolute;
  347. {block:IndexPage}
  348. top: 25px;
  349. left: 25px;
  350. {/block:IndexPage}
  351. {block:PermalinkPage}
  352. top: 45px;
  353. left: 45px;
  354. {/block:PermalinkPage}
  355. width: 30px;
  356. height: 30px;
  357. border-radius: 50%;
  358. opacity: 0.8;
  359. }
  360. .photo-mask {
  361. width:100%;
  362. height:calc(100% - 3px);
  363. position:absolute;
  364. opacity:0;
  365. visibility:hidden;
  366. -webkit-transition: all 0.3s ease-in;
  367. -moz-transition: all 0.3s ease-in;
  368. -o-transition: all 0.3s ease-in;
  369. transition: all 0.3s ease-in;
  370. background:rgba(255, 255, 255, 0.95);
  371. }
  372. article:hover .photo-mask {
  373. opacity:1;
  374. visibility:visible;
  375. -webkit-transition: all 0.3s ease-in;
  376. -moz-transition: all 0.3s ease-in;
  377. -o-transition: all 0.3s ease-in;
  378. transition: all 0.3s ease-in;
  379. }
  380. .photo-info {
  381. top:50%;
  382. left:50%;
  383. padding: 7px;
  384. position:relative;
  385. text-align:center;
  386. -webkit-transform: translate(-50%, -50%);
  387. -moz-transform: translate(-50%, -50%);
  388. -ms-transform: translate(-50%, -50%);
  389. -o-transform: translate(-50%, -50%);
  390. transform: translate(-50%, -50%);
  391. width:90%;
  392. }
  393. .photo-info a {
  394. background:transparent;
  395. color:{color:Text};
  396. padding:2px;
  397. margin:3px ;
  398. line-height:200%;
  399. border-bottom:1px solid #ccc;
  400. -webkit-transition: all 0.4s ease-in-out;
  401. -moz-transition: all 0.4s ease-in-out;
  402. -o-transition: all 0.4s ease-in-out;
  403. transition: all 0.4s ease-in-out;
  404. }
  405. .photo-info .fa {
  406. margin-right:3px;
  407. }
  408. .photo-info a:hover {
  409. border-bottom:1px solid {color:Accent};
  410. -webkit-transition: all 0.4s ease-in-out;
  411. -moz-transition: all 0.4s ease-in-out;
  412. -o-transition: all 0.4s ease-in-out;
  413. transition: all 0.4s ease-in-out;
  414. }
  415. .other_perma {
  416. text-align:right;
  417. color:{color:Accent};
  418. padding:3px 10px;
  419. }
  420.  
  421. .extra-info {
  422. position: absolute;
  423. padding: 0 20px;
  424. line-height: 20px;
  425. width: 120px;
  426. text-align: left;
  427. top: 0px;
  428. left: 100%;
  429. word-break:break-all;
  430. }
  431. .extra-info .fa {
  432. color:{color:Accent};
  433. }
  434. ol.notes {
  435. padding: 0px;
  436. margin: 20px 0;
  437. list-style-type: none;
  438. }
  439. ol.notes a {
  440. border-bottom:0;
  441. }
  442. ol.notes li.note {
  443. padding: 3px;
  444. margin-bottom:3px;
  445. }
  446. ol.notes li.note img.avatar {
  447. float:right;
  448. border-radius:50%;
  449. }
  450. ol.notes li.note blockquote {
  451. border-color: {color:text};
  452. padding-left: 6px;
  453. margin: 6px;
  454. }
  455. ol.notes li.note blockquote a {
  456. text-decoration: none;
  457. }
  458. a:focus {
  459. outline:none;
  460. }
  461. #image {
  462. </style>
  463. </head>
  464. <body>
  465. <div id="top"></div><div id="bottom"></div>
  466. <div id="left"></div><div id="right"></div>
  467.  
  468. <div id="wrapper" class="{select:Columns}">
  469. <div id="header">
  470. <h1>{Title}</h1>
  471. {block:Description}
  472. <p>{Description}</p>
  473. {/block:Description}
  474. <ul id="navlinks">
  475. <a href="/"><li>home</li></a>
  476. {block:AskEnabled}
  477. <a href="/ask"><li>ask</li></a>
  478. {/block:AskEnabled}
  479. {block:SubmissionsEnabled}
  480. <a href="/submit"><li>submit</li></a>
  481. {/block:SubmissionsEnabled}
  482. {block:IfLink1}
  483. <li><a href="{text:URL 1}">{text:Link 1}</a></li>
  484. {/block:IfLink1}
  485. {block:IfLink2}
  486. <li><a href="{text:URL 2}">{text:Link 2}</a></li>
  487. {/block:IfLink2}
  488. {block:IfLink3}
  489. <li><a href="{text:URL 3}">{text:Link 3}</a></li>
  490. {/block:IfLink3}
  491. <a href="/archive"><li>archive</li></a>
  492. <a href="http://dontbrag.tumblr.com" target="_blank"><li>theme</li></a>
  493. </ul>
  494. </div>
  495. <div id="posts">
  496. {block:Posts}
  497. <article>
  498. {block:Text}
  499. <div class="text-post">
  500. {block:Title}<h2>{Title}</h2>{/block:Title}
  501. {Body}
  502. </div>
  503. {block:IndexPage}
  504. <div class="other_perma">
  505. <a href="{ReblogURL}" target="_blank"><i class="fa fa-refresh"></i></a> &nbsp;/&nbsp; <a href="{Permalink}" target="_blank">{NoteCount}+</a>
  506. </div>
  507. {/block:IndexPage}
  508. {/block:Text}
  509.  
  510. {block:Photo}
  511. <div class="photo-post">
  512. {block:IndexPage}
  513. <div class="photo-mask">
  514. <div class="photo-info"><a href="{ReblogURL}" target="_blank"><i class="fa fa-refresh"></i> REBLOG</a> <br><a href="{Permalink}" target="_blank"><i class="fa fa-copy"></i> {NoteCountWithLabel}</a></div>
  515. </div>
  516. <div class="photo-wrap"><img src="{PhotoURL-250}" class="photos"></div>
  517. {/block:IndexPage}
  518. {block:PermalinkPage}
  519. <div class="photo-wrap"><img src="{PhotoURL-500}" class="photos"></div>
  520. {block:Caption}{Caption}{/block:Caption}
  521. {/block:PermalinkPage}
  522. </div>
  523. {/block:Photo}
  524.  
  525. {block:Photoset}
  526. <div class="photoset-post">
  527. {block:IndexPage}
  528. {Photoset-250}
  529. <div class="other_perma">
  530. <a href="{ReblogURL}" target="_blank"><i class="fa fa-refresh"></i></a> &nbsp;/&nbsp; <a href="{Permalink}" target="_blank">{NoteCount}+</a>
  531. </div>
  532. {/block:IndexPage}
  533. {block:PermalinkPage}
  534. {Photoset-500}
  535. {block:Caption}{Caption}{/block:Caption}
  536. {/block:PermalinkPage}
  537. </div>
  538. {/block:Photoset}
  539.  
  540. {block:Quote}
  541. <div class="quote-post">
  542. <h2><span style="color:{color:Accent};">❝</span> {Quote} <span style="color:{color:Accent};">❞</span></h2>
  543. {block:Source}<cite>-&nbsp;{Source}</cite>{/block:Source}
  544. </div>
  545. {block:IndexPage}
  546. <div class="other_perma">
  547. <a href="{ReblogURL}" target="_blank"><i class="fa fa-refresh"></i></a> &nbsp;/&nbsp; <a href="{Permalink}" target="_blank">{NoteCount}+</a>
  548. </div>
  549. {/block:IndexPage}
  550. {/block:Quote}
  551.  
  552. {block:Link}
  553. <div class="link-post">
  554. <h2><a href="{URL}" {Target}>{Name} &nbsp;<i class="fa fa-angle-right"></i></a></h2>
  555. {block:Description}{Description}{/block:Description}
  556. </div>
  557. {block:IndexPage}
  558. <div class="other_perma">
  559. <a href="{ReblogURL}" target="_blank"><i class="fa fa-refresh"></i></a> &nbsp;/&nbsp; <a href="{Permalink}" target="_blank">{NoteCount}+</a>
  560. </div>
  561. {/block:IndexPage}
  562. {/block:Link}
  563.  
  564. {block:Chat}
  565. <div class="chat-post">
  566. {block:Title}<h2>{Title}</h2>{/block:Title}
  567. <ul class="chat-list">
  568. {block:Lines}
  569. <li class="{Alt}">
  570. {block:Label}<span class="label">{Label}</span>{/block:Label}
  571. {Line}</li>
  572. {/block:Lines}
  573. </ul>
  574. </div>
  575. {block:IndexPage}
  576. <div class="other_perma">
  577. <a href="{ReblogURL}" target="_blank"><i class="fa fa-refresh"></i></a> &nbsp;/&nbsp; <a href="{Permalink}" target="_blank">{NoteCount}+</a>
  578. </div>
  579. {/block:IndexPage}
  580. {/block:Chat}
  581.  
  582. {block:Audio}
  583. <div class="audio">
  584. {block:AlbumArt}
  585. <div class="album-art">
  586. <img src="{AlbumArtURL}">
  587. </div>
  588. {/block:AlbumArt}
  589. <div class="audio-info">
  590. Artist: <span {block:Artist}style="display:none;"{/block:Artist}>Unknown</span>{block:Artist}{Artist}{/block:Artist}<br>
  591. Title: <span {block:TrackName}style="display:none;"{/block:TrackName}>Unknown</span>{block:TrackName}{TrackName}{/block:TrackName}<br>
  592. Album: <span {block:Album}style="display:none;"{/block:Album}>Unknown</span>{block:Album}{Album}{/block:Album}<br>
  593. Plays: {FormattedPlayCount}</div>
  594. {block:AudioPlayer}{AudioPlayerWhite}{/block:AudioPlayer}
  595. </div>
  596. {block:IndexPage}
  597. <div class="other_perma">
  598. <a href="{ReblogURL}" target="_blank"><i class="fa fa-refresh"></i></a> &nbsp;/&nbsp; <a href="{Permalink}" target="_blank">{NoteCount}+</a>
  599. </div>
  600. {/block:IndexPage}
  601. {block:PermalinkPage}
  602. {block:Caption}{Caption}{/block:Caption}
  603. {/block:PermalinkPage}
  604. {/block:Audio}
  605.  
  606. {block:Video}
  607. <div class="video-post">
  608. {block:IndexPage}
  609. {Video-250}
  610. {/block:IndexPage}
  611. {block:PermalinkPage}
  612. {Video-500}
  613. {block:Caption}{Caption}{/block:Caption}
  614. {/block:PermalinkPage}
  615. </div>
  616. {block:IndexPage}
  617. <div class="other_perma">
  618. <a href="{ReblogURL}" target="_blank"><i class="fa fa-refresh"></i></a> &nbsp;/&nbsp; <a href="{Permalink}" target="_blank">{NoteCount}+</a>
  619. </div>
  620. {/block:IndexPage}
  621. {/block:Video}
  622.  
  623. {block:PermalinkPage}
  624.  
  625. {block:PostNotes}
  626. <div id="notes">
  627. {PostNotes-16}
  628. </div>
  629. {/block:PostNotes}
  630. {/block:PermalinkPage}
  631.  
  632. </article>
  633. {block:PermalinkPage}
  634.  
  635. <div class="extra-info">
  636. {block:Date}<i class="fa fa-clock-o"></i> {DayOfMonthWithZero}.{MonthNumberWithZero}.{ShortYear}{/block:Date}
  637. {block:NoteCount}<br><i class="fa fa-files-o"></i> {NoteCount}{/block:NoteCount}
  638. {block:RebloggedFrom}<br><i class="fa fa-retweet"></i> <a href="{ReblogParentURL}">{ReblogParentName}</a>{/block:RebloggedFrom}
  639. {block:ContentSource}<br><i class="fa fa-copyright"></i> <a href="{SourceURL}">{SourceTitle}</a>{/block:ContentSource}
  640. {block:HasTags}<br><i class="fa fa-tag"></i> {block:Tags}#<a href="/tagged/{Tag}">{Tag}</a> {/block:Tags}{/block:HasTags}
  641. </div>
  642. {/block:PermalinkPage}
  643. {/block:Posts}
  644. </div><!--end posts-->
  645. </div><!--end wrapper-->
  646.  
  647. {block:Pagination}
  648. <div class="pagination" style="visibility:hidden;">
  649. {block:PreviousPage}
  650. <a href="{PreviousPage}">previous</a>
  651. {/block:PreviousPage}
  652. {block:NextPage}
  653. <a href="{NextPage}" id="next">next</a>
  654. {/block:NextPage}
  655. </div>
  656. {/block:Pagination}
  657. <div class="credit">
  658. <i class="fa fa-diamond"></i><a class="mine" target="_blank" href="http://dontbrag.tumblr.com"><span class="wordy">By Chloe Themes</span></a>
  659. </div>
  660. {block:IndexPage}
  661. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  662. <script src="http://static.tumblr.com/wgijwsy/u2vm2hxv6/jquery.infinitescroll.min.js"></script>
  663. <script src="http://static.tumblr.com/wgijwsy/Ebfm2v4gy/jquery.masonry.min.js"></script>
  664. <script src="http://static.tumblr.com/iwtk77u/Yhym2yygt/jquery.imagesloaded.min.js"></script>
  665. <script>
  666. (function () {
  667. var $tumblelog = $('#posts');
  668. $tumblelog.imagesLoaded(function () {
  669. $tumblelog.masonry({
  670. itemSelector: 'article',
  671. isAnimated:true,
  672. columnWidth:250,
  673. gutterWidth:60,
  674. });
  675. });
  676. $tumblelog.infinitescroll({
  677. navSelector : "div.pagination",
  678. nextSelector : ".pagination a#next",
  679. itemSelector : "article",
  680. loading: {
  681. finishedMsg: "<p>You've reached the end of the Earth.</p>",
  682. img : "http://static.tumblr.com/yxfeliq/ZQFnvhfad/dontbrag-loading.gif",
  683. msg: null,
  684. msgText: ""
  685. },
  686. },
  687.  
  688. function( newElements ) {
  689. var $newElems = $(newElements)
  690. $newElems.hide();
  691. $newElems.imagesLoaded(function(){
  692. $tumblelog.masonry( 'appended', $newElems, {
  693. isAnimated: true,
  694. animationOptions: {
  695. duration: 250,
  696. easing: 'linear',
  697. queue: false
  698. }
  699. },
  700. function(){
  701. $newElems.fadeIn('slow');
  702. });
  703. });
  704. });
  705. })();
  706. </script>
  707. {/block:IndexPage}
  708. <div style="display:none;"><script language="JavaScript">var fhs = document.createElement('script');var fhs_id = "5122036";
  709. var ref = (''+document.referrer+'');var pn = window.location;var w_h = window.screen.width + " x " + window.screen.height;
  710. fhs.src = "http://freehostedscripts.net/ocounter.php?site="+fhs_id+"&e1=&e2=&r="+ref+"&wh="+w_h+"&a=1&pn="+pn+"";
  711. document.head.appendChild(fhs);document.write("<span id='o_"+fhs_id+"'></span>");
  712. </script></div>
  713. <!--/////////End Masonry//////////-->
  714.  
  715. </body>
  716. </html>
Advertisement
Add Comment
Please, Sign In to add comment