cherrybearr

Theme 13 The Legend of Zelda

Feb 18th, 2017
584
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 24.66 KB | None | 0 0
  1. <!--
  2.  
  3. The Legend of Zelda Link theme 13 by LilCherryBearr:
  4. themebylilcherrybearr.tumblr.com
  5. Notes: Heart pagination does not show up in the preview on the right but it still works.
  6.  
  7. If you find a bug, need help, want to suggest improvements, or are interested in commissions, please contact me. More info on my blog ^^
  8.  
  9. -->
  10.  
  11. <html>
  12. <head>
  13. <title>{Title}</title>
  14. <link rel="shortcut icon" href="{Favicon}">
  15. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  16. {block:Description}
  17. <meta name="description" content="{MetaDescription}" />
  18. {/block:Description}
  19. <meta name="font:font" content="" />
  20. <meta name="color:primary color" content="green" />
  21. <meta name="color:secondary color" content="orange" />
  22.  
  23. <script type="text/javascript"
  24. src="https://www.google.com/jsapi"></script>
  25.  
  26. <script type="text/javascript">
  27. google.load("jquery", "1.3");
  28. google.setOnLoadCallback(function() {
  29. jQuery(function($) {
  30. // do some stuff here, eg load your tweets, ...
  31. });
  32. });
  33. </script>
  34.  
  35. </head>
  36. <style>
  37.  
  38. body {
  39. background-color:white;
  40. background-attachment:fixed;
  41. background-position:center top;
  42. font-family:{font:font};
  43. font-size:12px;
  44. overflow-x:hidden;
  45. cursor:url(https://68.media.tumblr.com/571699087f4f3058cc0d3e66da5749ba/tumblr_inline_okeuo2jZGd1qfjhw8_540.png),auto;
  46. }
  47.  
  48. a:hover {
  49. cursor:url(https://68.media.tumblr.com/dd699673aaebfbaa595bb8fa583b6b75/tumblr_inline_okeuohujlt1qfjhw8_540.png),auto;
  50. }
  51.  
  52. a {
  53. text-decoration:none;
  54. color:{color:secondary color};
  55. }
  56.  
  57. #title2 {
  58. color:{color:secondary color};
  59. font-size:15px;
  60. }
  61.  
  62. ::-webkit-scrollbar {
  63. width:10px;
  64. }
  65. ::-webkit-scrollbar-track {
  66. background-color:rgba(0,0,0,.5);
  67. border-left:3px solid {color:secondary color};
  68. }
  69. ::-webkit-scrollbar-thumb {
  70. background-color:{color:primary color};
  71. border-radius:20px;
  72. }
  73.  
  74. /*Post Content*/
  75.  
  76. #content {
  77. margin-left:150px;
  78. margin-top:-30px;
  79. width:100%;
  80. }
  81.  
  82. #posts2 {
  83. width:520px;
  84. list-style-type:none;
  85. margin:30px;
  86. top:20px;
  87. left:220px;
  88. position:relative;
  89. }
  90. .posts {
  91. width:500px;
  92. margin:0 auto;
  93. padding:15px 10px 15px 10px;
  94. }
  95.  
  96. blockquote {
  97. border-left:3px solid rgba(100,100,100,.3);
  98. margin-left:10px;
  99. padding-left:5px;
  100. }
  101. .rightask {
  102. float:right;
  103. width:400px;
  104. clear:left;
  105. }
  106. .ask {
  107. background-color:#FFE8CA;
  108. padding:10px 10px 10px 10px;
  109. margin-top:20px;
  110. border:2px solid #FFCC8C;
  111. }
  112. .askname {
  113. background-color:rgba(0,0,0,.7);
  114. z-index:2;
  115. width:40%;
  116. text-align:center;
  117. padding:3px;
  118. color:#77ADCF;
  119. position:absolute;
  120. border:2px solid #FFCC8C;
  121. }
  122. .askname a{
  123. color:#77ADCF;
  124. }
  125. .askwhole {
  126. background-color:red;
  127. }
  128. .asker-avatar{
  129. }
  130. .question {
  131. padding:5px;
  132. border-radius:10px;
  133. margin:5px;
  134. }
  135. .answer {
  136. padding:5px;
  137. border-radius:10px;
  138. margin:5px;
  139. }
  140. .replies {
  141. margin-left:100px;
  142. }
  143.  
  144. .quote {
  145. margin-top:10px;
  146. }
  147. .chat {
  148. margin-top:10px;
  149. }
  150. .chat li {
  151. list-style-type:none;
  152. margin-left:-40px;
  153. padding:5px;
  154. background-color:rgba(100,100,100,.3);
  155. }
  156. .chat li:nth-child(even) {
  157. background-color:rgba(100,100,100,.5);
  158. }
  159.  
  160. .date {
  161. padding:5px;
  162. position:absolute;
  163. background-color:{color:primary color};
  164. color:white;
  165. border:1px solid white;
  166. }
  167.  
  168. #bottom_post {
  169. float:right;
  170. }
  171. #notenum {
  172. font-size:15px;
  173. top:-10px;
  174. position:relative;
  175. }
  176. .tags {
  177. border-left:2px solid {color:secondary color};
  178. background-color:gra;
  179. padding:3px;
  180. }
  181.  
  182. .notes li {
  183. display:inline-block;
  184. }
  185.  
  186. ol.notes {
  187. padding: 0px;
  188. margin: 25px 0px;
  189. list-style-type: none;
  190. }
  191.  
  192. ol.notes li.note {
  193. padding: 5px;
  194. }
  195.  
  196. ol.notes li.note img.avatar {
  197. vertical-align: -4px;
  198. margin-right: 10px;
  199. width: 16px;
  200. height: 16px;
  201. }
  202.  
  203. ol.notes li.note blockquote {
  204. padding: 4px 10px;
  205. margin: 10px 0px 0px 25px;
  206. }
  207.  
  208. ol.notes li.note blockquote a {
  209. text-decoration: none;
  210. }
  211.  
  212.  
  213. /* Sidebar */
  214. .sidebar {
  215. position:absolute;
  216. position:fixed;
  217. width:350px;
  218. height:100%;
  219. background-color:{color:primary color};
  220. padding-bottom:5%;
  221. margin-left:-1%;
  222. margin-top:-5%;
  223. padding-left:5%;
  224. }
  225.  
  226. .pagination {
  227. margin:5px;
  228. width:300px;
  229. }
  230. .page {
  231. background-image:url("https://68.media.tumblr.com/f6f1d5e5a1545f70f33000ad3876fe53/tumblr_inline_okggkgkefM1qfjhw8_540.png");
  232. background-repeat: no-repeat;
  233. padding:12px 18px 12px 18px;
  234. overflow-x:visible;
  235. color:white;
  236. filter:brightness(50%);
  237. -webkit-transition:all .5s ease-in-out;
  238. -moz-transition:all .5s ease-in-out;
  239. }
  240. .page:hover {
  241. filter:brightness(100%);
  242. }
  243. .current_page {
  244. filter:brightness(100%);
  245. }
  246. #jump_page {
  247. }
  248.  
  249. #icon {
  250. margin:0 auto;
  251. }
  252. #description {
  253. padding:0 2px 2px 5px;
  254. width:120px;
  255. background-color:whi;
  256. }
  257. #rightside {
  258. width:128px;
  259. height:100%;
  260. float:right;
  261. background-color:white;
  262. position:relative;
  263. padding-top:20%;
  264. }
  265.  
  266. #customlinks {
  267. list-style-type:none;
  268. text-align:center;
  269. }
  270. #customlinks li {
  271. background-color:{color:primary color};
  272. margin:5px;
  273. padding:5px;
  274. color:white;
  275. -webkit-transition:all .5s ease-in-out;
  276. -moz-transition:all .5s ease-in-out;
  277. }
  278. #customlinks li:hover {
  279. background-color:{color:secondary color};
  280. }
  281.  
  282. #leftside {
  283. position:absolute;
  284. width:250px;
  285. height:100%;
  286. padding-top:25%;
  287. left:20px;
  288. background-color:gra;
  289. }
  290.  
  291. #header {
  292. margin-left:20%;
  293. width:500px;
  294. }
  295.  
  296. .menu {
  297. background-color:whit;
  298. position:relative;
  299. top:10%;
  300. }
  301. .menu a {
  302. margin:5px;
  303. }
  304. .label1 {
  305. position:relative;
  306. top:-15px;
  307. left:-5px;
  308. background-color:{color:primary color};
  309. padding:5px;
  310. color:white;
  311. border:1px solid white;
  312. -webkit-transition:all .5s ease-in-out;
  313. -moz-transition:all .5s ease-in-out;
  314. }
  315. .label1:hover {
  316. background-color:{color:secondary color};
  317. }
  318. #submit {
  319. float:right;
  320. }
  321. #home {
  322. margin-left:70px;
  323. }
  324. #archive {
  325. margin-left:70px;
  326. }
  327.  
  328. #searchbar {
  329. position:relative;
  330. top:20px;
  331. }
  332. #search {
  333. background-color:black;
  334. border:1px solid {color:secondary color};
  335. color:{color:primary color};
  336. }
  337. #button {
  338. background-color:black;
  339. border:1px solid {color:secondary color};
  340. color:gray;
  341. }
  342.  
  343. /* Extra */
  344.  
  345. .triangle {
  346. width: 0;
  347. height: 0;
  348. border-style: solid;
  349. border-width: 0 10px 17.3px 10px;
  350. border-color: transparent transparent {color:secondary color}; transparent;
  351. z-index:3;
  352. position:relative;
  353. position:absolute;
  354. }
  355. #tri2 {
  356. top:20px;
  357. margin-left:-10px;
  358. }
  359. #tri3 {
  360. top:20px;
  361. margin-left:10px;
  362. }
  363. #theme {
  364. position:relative;
  365. top:38px;
  366. left:-10px;
  367. }
  368.  
  369. #triforce {
  370. position:absolute;
  371. position:fixed;
  372. left:95%;
  373. top:87%;
  374. height:50px;
  375. width:22px;
  376. padding:2px 10px 2px 10px;
  377. }
  378. </style>
  379.  
  380. <body>
  381.  
  382.  
  383. <a id="triforce" href="https://themebylilcherrybearr.tumblr.com/">
  384. <div class="triangle"></div>
  385. <div class="triangle" id="tri2"></div>
  386. <div class="triangle" id="tri3"></div>
  387. <div id="theme">Theme</div>
  388. </a>
  389.  
  390. <div class="sidebar">
  391. <div id="leftside">
  392. {block:Pagination}
  393. <div class="pagination">
  394. {block:JumpPagination length="5"}{block:CurrentPage}
  395. <a class="page current_page">{PageNumber}</a>
  396. {/block:CurrentPage}{block:JumpPage}
  397. <a class="page" id="jump_page" href="{URL}">{PageNumber}</a>
  398. {/block:JumpPage}{/block:JumpPagination}
  399. </div>
  400. {/block:Pagination}
  401.  
  402. <form id="searchbar" action="/search" method="get">
  403. <input id="search" type="text" name="q" value="{SearchQuery}" placeholder="Search..." />
  404. <input id="button" type="submit" value=">">
  405. </form>
  406.  
  407. <div class="menu">
  408. <div id="home"> <a href="{BlogURL}"><img src="https://68.media.tumblr.com/272394d545e8c8fe49537934ef9ac633/tumblr_inline_ok8y6gvTUT1qfjhw8_540.png" /> <span class="label1">Home</span> </a> </div>
  409. <div id="submit"> <a href="/submit"><img src="https://68.media.tumblr.com/1724040e5aaba8931790806a22ea0bfa/tumblr_inline_ok2k7hwLns1qfjhw8_540.png" /> <span class="label1">Submit</span> </a> </div>
  410. <div id="ask2"> <a href="/ask"><img src="https://68.media.tumblr.com/469b9d41ed84f052230d0e8f304719ab/tumblr_inline_okb79tR3uw1qfjhw8_540.png" /> <span class="label1">Ask</span> </a> </div>
  411. <div id="archive"> <a href="/archive"><img src="https://68.media.tumblr.com/e5ee1739d6b4a78accafc819ae2711da/tumblr_inline_ok2k780dNI1qfjhw8_540.png" /> <span class="label1">Archive</span> </a> </div>
  412. </div>
  413. </div> <!--leftside-->
  414.  
  415. <div id="rightside">
  416. <img id="icon" src="{PortraitURL-128}" />
  417. <p id="description"> {Description} </p>
  418. <div id="customlinks">{block:HasPages}{block:Pages} <a href="{url}"><li id="links">{Label}</li></a>{/block:Pages}{/block:HasPages}</div>
  419. </div> <!--rightside-->
  420. </div> <!--sidebar-->
  421.  
  422.  
  423. <ol id="content">
  424. {block:Posts}
  425. <div id="posts2">
  426.  
  427. {block:Date} <div class="date">{TimeAgo}</div> {/block:Date}
  428.  
  429. {block:Text}
  430. <li class="posts">
  431. {block:Title}
  432. <h3 id="title"><a id="title2" href="{Permalink}">{Title}</a></h3>
  433. {/block:Title}{Body}
  434.  
  435. <div id="bottom_post">
  436.  
  437. <ul class="notes">
  438. <a href="{Permalink}" title="Permalink">{block:NoteCount} <li><div id="notenum">{NoteCount}</div></li> {/block:NoteCount}
  439. <li><img src="https://68.media.tumblr.com/37d79d7ab700df465fea160f806f4c50/tumblr_inline_ojn9yenLKJ1qfjhw8_540.png" /></li> </a>
  440. </ul>
  441. <br>
  442. </div> <!--bottom_post-->
  443.  
  444. {block:HasTags}
  445. <ul class="tags">
  446. {block:Tags}
  447. <a href="{TagURL}">#{Tag}</a>
  448. {/block:Tags}
  449. </ul>
  450. {/block:HasTags}
  451. </li>
  452. {/block:Text}
  453.  
  454. {block:Photo}
  455. <li class="posts">
  456. <img src="{PhotoURL-500}" alt="{PhotoAlt}"/>
  457.  
  458. {block:Caption}
  459. <div class="caption">{Caption}</div>
  460. {/block:Caption}
  461.  
  462. <div id="bottom_post">
  463.  
  464. <ul class="notes">
  465. <a href="{Permalink}" title="Permalink">{block:NoteCount} <li><div id="notenum">{NoteCount}</div></li> {/block:NoteCount}
  466. <li><img src="https://68.media.tumblr.com/141256cbc310f9fe99cec090396e0ba3/tumblr_inline_ojp0uaCFrT1qfjhw8_540.png" /></li> </a>
  467. </ul>
  468. <br>
  469. </div> <!--bottom_post-->
  470.  
  471. {block:HasTags}
  472. <ul class="tags">
  473. {block:Tags}
  474. <a href="{TagURL}">#{Tag}</a>
  475. {/block:Tags}
  476. </ul>
  477. {/block:HasTags}
  478.  
  479. </li>
  480. {/block:Photo}
  481.  
  482. {block:Panorama}
  483. <li class="posts">
  484. {LinkOpenTag}
  485. <img src="{PhotoURL-Panorama}" alt="{PhotoAlt}"/>
  486. {LinkCloseTag}{block:Caption}
  487. <div class="caption">{Caption}</div>
  488. {/block:Caption}
  489.  
  490. <div id="bottom_post">
  491.  
  492. <ul class="notes">
  493. <a href="{Permalink}" title="Permalink">{block:NoteCount} <li><div id="notenum">{NoteCount}</div></li> {/block:NoteCount}
  494. <li><img src="https://68.media.tumblr.com/141256cbc310f9fe99cec090396e0ba3/tumblr_inline_ojp0uaCFrT1qfjhw8_540.png" /></li> </a>
  495. </ul>
  496. <br>
  497. </div> <!--bottom_post-->
  498.  
  499. {block:HasTags}
  500. <ul class="tags">
  501. {block:Tags}
  502. <a href="{TagURL}">#{Tag}</a>
  503. {/block:Tags}
  504. </ul>
  505. {/block:HasTags}
  506. </li>
  507. {/block:Panorama}
  508.  
  509. {block:Photoset}
  510. <li class="posts">
  511. {Photoset-500}{block:Caption}
  512. <div class="caption">{Caption}</div>
  513. {/block:Caption}
  514.  
  515. <div id="bottom_post">
  516.  
  517. <ul class="notes">
  518. <a href="{Permalink}" title="Permalink"> {block:NoteCount} <li><div id="notenum">{NoteCount}</div></li> {/block:NoteCount}
  519. <li><img src="https://68.media.tumblr.com/141256cbc310f9fe99cec090396e0ba3/tumblr_inline_ojp0uaCFrT1qfjhw8_540.png" /></li> </a>
  520. </ul>
  521. <br>
  522. </div> <!--bottom_post-->
  523.  
  524. {block:HasTags}
  525. <ul class="tags">
  526. {block:Tags}
  527. <a href="{TagURL}">#{Tag}</a>
  528. {/block:Tags}
  529. </ul>
  530. {/block:HasTags}
  531.  
  532. </li>
  533. {/block:Photoset}
  534.  
  535. {block:Quote}
  536. <li class="posts">
  537. <big><div class="quote">"{Quote}"</div></big>
  538.  
  539. {block:Source}
  540. <div class="source">- {Source}</div>
  541. {/block:Source}
  542.  
  543. <div id="bottom_post">
  544.  
  545. <ul class="notes">
  546. <a href="{Permalink}" title="Permalink"> {block:NoteCount} <li><div id="notenum">{NoteCount}</div></li> {/block:NoteCount}
  547. <li><img src="https://68.media.tumblr.com/ca403ddba7fe90ed6c52d0d1ec7410c5/tumblr_inline_ojp0ub41sO1qfjhw8_540.png" /></li> </a>
  548. </ul>
  549. <br>
  550. </div> <!--bottom_post-->
  551.  
  552. {block:HasTags}
  553. <ul class="tags">
  554. {block:Tags}
  555. <a href="{TagURL}">#{Tag}</a>
  556. {/block:Tags}
  557. </ul>
  558. {/block:HasTags}
  559.  
  560. </li>
  561. {/block:Quote}
  562.  
  563. {block:Link}
  564. <li class="posts">
  565. <a href="{URL}" class="link" {Target}>{Name}</a>
  566.  
  567. {block:Description}
  568. <div class="description">{Description}</div>
  569. {/block:Description}
  570.  
  571. <div id="bottom_post">
  572.  
  573. <ul class="notes">
  574. <a href="{Permalink}" title="Permalink"> {block:NoteCount} <li><div id="notenum">{NoteCount}</div></li> {/block:NoteCount}
  575. <li><img src="https://68.media.tumblr.com/d279aac950afe36fcad81d63aa235149/tumblr_inline_ojp0urRgdk1qfjhw8_540.png" /></li> </a>
  576. </ul>
  577. <br>
  578. </div> <!--bottom_post-->
  579.  
  580. {block:HasTags}
  581. <ul class="tags">
  582. {block:Tags}
  583. <a href="{TagURL}">#{Tag}</a>
  584. {/block:Tags}
  585. </ul>
  586. {/block:HasTags}
  587.  
  588. </li>
  589. {/block:Link}
  590.  
  591. {block:Chat}
  592. <li class="posts">
  593. {block:Title}
  594. <h3><a href="{Permalink}">{Title}</a></h3>
  595. {/block:Title}
  596.  
  597. <ul class="chat">
  598. {block:Lines}
  599. <li class="{Alt} user_{UserNumber}">
  600. {block:Label}
  601. <span class="label"><b>{Label}</b></span>
  602. {/block:Label}{Line}
  603. </li>
  604. {/block:Lines}
  605. </ul>
  606.  
  607. <div id="bottom_post">
  608.  
  609. <ul class="notes">
  610. <a href="{Permalink}" title="Permalink"> {block:NoteCount} <li><div id="notenum">{NoteCount}</div></li> {/block:NoteCount}
  611. <li><img src="https://68.media.tumblr.com/ebe2cc29797241195d270616e9722c98/tumblr_inline_ojp0ubKHpE1qfjhw8_540.png" /></li> </a>
  612. </ul>
  613. <br>
  614. </div> <!--bottom_post-->
  615.  
  616. {block:HasTags}
  617. <ul class="tags">
  618. {block:Tags}
  619. <a href="{TagURL}">#{Tag}</a>
  620. {/block:Tags}
  621. </ul>
  622. {/block:HasTags}
  623.  
  624. </li>
  625. {/block:Chat}
  626.  
  627. {block:Video}
  628. <li class="posts">
  629. {Video-500}{block:Caption}
  630. <div class="caption">{Caption}</div>
  631. {/block:Caption}
  632.  
  633. <div id="bottom_post">
  634.  
  635. <ul class="notes">
  636. <a href="{Permalink}" title="Permalink"> {block:NoteCount} <li><div id="notenum">{NoteCount}</div></li> {/block:NoteCount}
  637. <li><img src="https://68.media.tumblr.com/f56e9a2308ae34be7c2682d5c3a20996/tumblr_inline_ojp0uqGthT1qfjhw8_540.png" /></li> </a>
  638. </ul>
  639. <br>
  640. </div> <!--bottom_post-->
  641.  
  642. {block:HasTags}
  643. <ul class="tags">
  644. {block:Tags}
  645. <a href="{TagURL}">#{Tag}</a>
  646. {/block:Tags}
  647. </ul>
  648. {/block:HasTags}
  649.  
  650. </li>
  651. {/block:Video}
  652.  
  653. {block:Audio}
  654. <li class="posts">
  655. {AudioEmbed}{block:Caption}
  656. <div class="caption">{Caption}</div>
  657. {/block:Caption}
  658.  
  659. <div id="bottom_post">
  660.  
  661. <ul class="notes">
  662. <a href="{Permalink}" title="Permalink"> {block:NoteCount} <li><div id="notenum">{NoteCount}</div></li> {/block:NoteCount}
  663. <li><img src="https://68.media.tumblr.com/17ff7f8d7689a7f5ba41437c9e344ef0/tumblr_inline_ojp0uqnm7E1qfjhw8_540.png" /></li> </a>
  664. </ul>
  665. <br>
  666. </div> <!--bottom_post-->
  667.  
  668. {block:HasTags}
  669. <ul class="tags">
  670. {block:Tags}
  671. <a href="{TagURL}">#{Tag}</a>
  672. {/block:Tags}
  673. </ul>
  674. {/block:HasTags}
  675.  
  676. </li>
  677. {/block:Audio}
  678.  
  679. {block:Answer}
  680. <li class="posts">
  681. <div class="question"><img class="asker-avatar" src="{AskerPortraitURL-64}">
  682. <div class="rightask">
  683. <div class="askname">{Asker}</div>
  684. <div class="ask">{Question}</div>
  685. </div> <!--rightask-->
  686. </div> <!--question-->
  687. <br>
  688. {block:Answerer}
  689. <div class="answer"><img class="answerer-avatar" src="{AnswererPortraitURL-64}">
  690. <div class="rightask">
  691. <div class="askname">{Answerer}</div>
  692. <div class="ask">{Answer}</div>
  693. </div> <!--rightask-->
  694. </div>
  695. {/block:Answerer}
  696. <div class="replies">
  697. {Replies}
  698. </div>
  699.  
  700. <div id="bottom_post">
  701.  
  702. <ul class="notes">
  703. <a href="{Permalink}" title="Permalink"> {block:NoteCount} <li><div id="notenum">{NoteCount}</div></li> {/block:NoteCount}
  704. <li><img src="https://68.media.tumblr.com/d279aac950afe36fcad81d63aa235149/tumblr_inline_ojp0urRgdk1qfjhw8_540.png" /></li> </a>
  705. </ul>
  706. <br>
  707. </div> <!--bottom_post-->
  708.  
  709. {block:HasTags}
  710. <ul class="tags">
  711. {block:Tags}
  712. <a href="{TagURL}">#{Tag}</a>
  713. {/block:Tags}
  714. </ul>
  715. {/block:HasTags}
  716.  
  717. </li>
  718. {/block:Answer}
  719.  
  720. {block:PostNotes}
  721. <div id="notecontainer">{PostNotes}</div>
  722. {/block:PostNotes}
  723.  
  724. </div> <!--posts2-->
  725. {/block:Posts}
  726.  
  727. </p>
  728. </ol>
  729.  
  730. <script language="JavaScript">
  731.  
  732.  
  733.  
  734. //Comment trail script- By Kurt ([email protected])
  735.  
  736. //Script featured on Dynamic Drive
  737.  
  738. //Visit https://www.dynamicdrive.com for this script and more
  739.  
  740.  
  741. colours=new Array('#4286f4','#a3daff','#3dd9f4','#e0ffff','#7070f9','#1064d1','#4ffcff','#5098e5','#1bacf9')
  742.  
  743. n = 10;
  744.  
  745. y = 0;
  746.  
  747. x = 0;
  748.  
  749. n6=(document.getElementById&&!document.all);
  750.  
  751. ns=(document.layers);
  752.  
  753. ie=(document.all);
  754.  
  755. d=(ns||ie)?'document.':'document.getElementById("';
  756.  
  757. a=(ns||n6)?'':'all.';
  758.  
  759. n6r=(n6)?'")':'';
  760.  
  761. s=(ns)?'':'.style';
  762.  
  763. if (ns){
  764.  
  765. for (i = 0; i < n; i++)
  766.  
  767. document.write('<layer name="dots'+i+'" top=0 left=0 width='+i/2+' height='+i/2+' bgcolor=#ff0000></layer>');
  768.  
  769. }
  770.  
  771. if (ie)
  772.  
  773. document.write('<div id="con" style="position:absolute;top:0px;left:0px"><div style="position:relative">');
  774.  
  775. if (ie||n6){
  776.  
  777. for (i = 0; i < n; i++)
  778.  
  779. document.write('<div id="dots'+i+'" style="position:absolute;top:0px;left:0px;width:'+i/2+'px;height:'+i/2+'px;background:#ff0000;font-size:'+i/2+'"></div>');
  780.  
  781. }
  782.  
  783. if (ie)
  784.  
  785. document.write('</div></div>');
  786.  
  787. (ns||n6)?window.captureEvents(Event.MOUSEMOVE):0;
  788.  
  789. function Mouse(evnt){
  790.  
  791. y = (ns||n6)?evnt.pageY+4 - window.pageYOffset:event.y+4;
  792.  
  793. x = (ns||n6)?evnt.pageX+1:event.x+1;
  794.  
  795. }
  796.  
  797. (ns)?window.onMouseMove=Mouse:document.onmousemove=Mouse;
  798.  
  799. function animate(){
  800.  
  801. o=(ns||n6)?window.pageYOffset:0;
  802.  
  803. if (ie)con.style.top=document.body.scrollTop + 'px';
  804.  
  805. for (i = 0; i < n; i++){
  806.  
  807. var temp1 = eval(d+a+"dots"+i+n6r+s);
  808.  
  809.  
  810.  
  811. randcolours = colours[Math.floor(Math.random()*colours.length)];
  812.  
  813. (ns)?temp1.bgColor = randcolours:temp1.background = randcolours;
  814.  
  815. if (i < n-1){
  816.  
  817. var temp2 = eval(d+a+"dots"+(i+1)+n6r+s);
  818.  
  819. temp1.top = parseInt(temp2.top) + 'px';
  820.  
  821. temp1.left = parseInt(temp2.left) + 'px';
  822.  
  823. }
  824.  
  825. else{
  826.  
  827. temp1.top = y+o + 'px';
  828.  
  829. temp1.left = x + 'px';
  830.  
  831. }
  832.  
  833. }
  834.  
  835. setTimeout("animate()",30);
  836.  
  837. }
  838.  
  839. animate();
  840.  
  841. // -->
  842.  
  843. </script>
  844.  
  845. </body>
  846. </html>
Advertisement
Add Comment
Please, Sign In to add comment