Theme for tumblr

<script type="text/javascript" src="http://playlist.me/w/script.js" data-config="{'skin':'http://static.tumblr.com/lnej02q/7Nvms5tlm/nova.css','volume':50,'autoplay':true,'shuffle':true,'repeat':1,'placement':'bottom','showplaylist':false,'playlist':[{'title':'%u2661','url':'http://www.youtube.com/watch?v=1m_sWJQm2fs'},{'title':'%u2661','url':'http://www.youtube.com/watch?v=UFGOcZoNbkk'},{'title':'%u2661 ','url':'http://www.youtube.com/watch?v=338HeOgF4QI&src_vid=gugUpIOdSro&feature=iv&annotation_id=annotation_4244286319'},{'title':'%u2661','url':'http://www.youtube.com/watch?v=EdBym7kv2IM'},{'title':'%u2661','url':'http://www.youtube.com/watch?v=erwyZjHDz1k'},{'title':'%u2661','url':'http://www.youtube.com/watch?v=la4tjQ_eT0c'},{'title':'%u2661','url':'http://www.youtube.com/watch?v=eWUnVyO1Klk'},{'title':'%u2661','url':'http://www.youtube.com/watch?v=CK-2YDBA3JU'},{'title':'%u2661','url':'http://www.youtube.com/watch?v=LadFb40-V00'},{'title':'%u2661','url':'http://www.youtube.com/watch?v=LB3RIecLY3o'},{'title':'%u2661','url':'http://www.youtube.com/watch?v=Vf8e3OozHlI'},{'title':'%u2661','url':'http://www.youtube.com/watch?v=rQKMLmXc0xo'},{'title':'%u2661','url':'http://www.youtube.com/watch?v=QkmMzKIFNyo'},{'title':'%u2661','url':'http://www.youtube.com/watch?v=cIFspx_BMN0'}]}" ></script><noscript><a href="http://playlist.me/songs/">player playlist</a></noscript>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<!-----------------------------------------------------------------------

A T H E M E B Y F I L M I N G T H E M E S.

please don't remove the credit or claim this work as your own.

thank you for using, you're great! ♥

T H E M E 0 3

filmingthemes.tumblr.com

------------------------------------------------------------------------->

<html xmlns="http://www.w3.org/1999/xhtml">

<style> body, a, a:hover { cursor:url('http://www.dolliehost.com/dolliecrave/cursors/cursors-arrow/arrow38.gif'), auto }</style>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>{Title}{block:PostTitle}: {PostTitle}{/block:PostTitle}</title>

{block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}

<link rel="shortcut icon" href="http://i122.photobucket.com/albums/o260/mhilka/minigifs/balaozinho40.gif">

<link rel="alternate" type="application/rss+xml" href="{RSS}">

<meta name="if:2 Columns" content="0" />



<meta name="if:Captions" content="0" />

<meta name="if:Custom Links" content="0" />

-moz-transition: all 0.5s ease;

-ms-transition: all 0.5s ease;

-o-transition: all 0.5s ease;

transition: all 0.5s ease;

{block:IfLight}

-webkit-filter: invert(100%);

{/block:IfLight}

}

#tumblr_controls:hover {

opacity: 0.8;

}

/* B A S I C S */

body {

padding: 0;

margin: 0;

line-height: 16px;

{block:IfLight}

color: #000000;

background-color: #ffffff;

{/block:IfLight}

{block:IfDark}

color: #ffffff;

background-color: #000000;

{/block:IfDark}

font: 10px 'judson', serif;

{block:IfLowercase}

text-transform: lowercase;

{/block:IfLowercase}

}

a {

text-decoration: none;

{block:IfLight}

color: #000000;

{/block:IfLight}

{block:IfDark}

color: #ffffff;

{/block:IfDark}

}

a:hover {

{block:IfUnderlineLinks}

text-decoration: underline;

{/block:IfUnderlineLinks}

{block:IfNotUnderlineLinks}

{block:IfShadows}

text-shadow: 0px 1px 2px rgba(150, 150, 150, 0.8);

{/block:IfShadows}

{/block:IfNotUnderlineLinks}

}

blockquote {

border-left: 3px solid #000000;

padding-left: 10px;

margin-left: 10px;

}

h1 {

font: 12px 'judson';

text-transform: uppercase;

text-align: center;

letter-spacing: 2px;

}

img {

display: block;

}

/*::-webkit-scrollbar-thumb {


border: 2px solid #ffffff;

height: 100px;

-webkit-border-radius: 14px;

-moz-border-radius: 14px;

border-radius: 14px;

}

::-webkit-scrollbar {

height: 100%;

width: 7px;


border: 3px solid #ffffff;

}*/

::selection {

{block:IfLight}

background: #000000;

color: #ffffff;

{/block:IfLight}

{block:IfDark}

background: #ffffff;

color: #000000;

{/block:IfDark}

}

::-moz-selection {

{block:IfLight}


color: #ffffff;

{/block:IfLight}

{block:IfDark}


color: #000000;

{/block:IfDark}

}

::-webkit-selection {

{block:IfLight}


color: #ffffff;

{/block:IfLight}

{block:IfDark}


color: #000000;

{/block:IfDark}

}

/* C O N T E N T */

#content {

position: absolute;

left: 50%;

padding-bottom: 100px;

{block:If3Columns}

margin: 150px 0px 0px -525px;

width: 1050px;

{/block:If3Columns}

{block:If2Columns}


width: 1200px;

{/block:If2Columns}

{block:If4Columns}


width: 1350px;

{/block:If4Columns}

{block:PermalinkPage}

width: 500px;


{/block:PermalinkPage}

}

/* H E A D E R */

#header {

padding: 75px 0px 0px 0px;

z-index: 100;

text-align: center;

height: 100px;

{block:IfTransparentHeader}

position: fixed;

width: 100%;

top: 0;

left: 0;

{/block:IfTransparentHeader}

{block:IfFixedHeader}

position: fixed;

{block:IfLight}


{/block:IfLight}

{block:IfDark}


{/block:IfDark}

{/block:IfFixedHeader}

{block:IfMovingHeader}

position: absolute;

{/block:IfMovingHeader}

left: 50%;

top: 0;

{block:If3Columns}

margin-left: -477px;

width: 954px;

{/block:If3Columns}

{block:If2Columns}


width: 1104px;

{/block:If2Columns}

{block:If4Columns}


width: 1254px;

{/block:If4Columns}

}

#nav {

word-spacing: 5px;


margin-top: -10px;

opacity: 0;


line-height: 10px;






}

#nav a:hover {


{block:IfShadows}


{/block:IfShadows}

{block:IfNotShadows}

border-bottom: 2px solid #000000;

{/block:IfNotShadows}

}

#title {


line-height: 75px;

font: 13px 'judson';


text-align: center;


{block:IfShadows}


{/block:IfShadows}

}

#title a:hover {

{block:IfLight}

color: #000000;

{/block:IfLight}

{block:IfDark}

color: #ffffff;

{/block:IfDark}

}

#header:hover #nav {

margin-top: 0px;

opacity: 1;

}

/* P O S T S */

.posts {

float: left;

text-align: justify;


width: 500px;


{block:IndexPage}

{block:If3Columns}

width: 250px;

{/block:If3Columns}

{block:If2Columns}

width: 500px;

{/block:If2Columns}

{block:If4Columns}

width: 200px;

{/block:If4Columns}

padding: 50px;

{/block:IndexPage}






}

.posts img {

{block:IfMonochromeImages}

-webkit-filter: grayscale(100%);

-moz-filter: grayscale(100%);

-ms-filter: grayscale(100%);

-o-filter: grayscale(100%);

filter: grayscale(100%);

{/block:IfMonochromeImages}

{block:IfShadows}

-webkit-shadow: 0px 1px 2px rgba(150, 150, 150, 0.8);

-moz-shadow: 0px 1px 2px rgba(150, 150, 150, 0.8);

-ms-shadow: 0px 1px 2px rgba(150, 150, 150, 0.8);

-o-shadow: 0px 1px 2px rgba(150, 150, 150, 0.8);

box-shadow: 0px 1px 2px rgba(150, 150, 150, 0.8);

{/block:IfShadows}






}

.posts img:hover {

{block:IndexPage}

{block:IfImageFade}

opacity: 0.7;

{/block:IfImageFade}

{/block:IndexPage}

}

iframe.photoset {

{block:If4Columns}

width: 200px;

{/block:If4Columns}

{block:IfMonochromeImages}

-webkit-filter: grayscale(100%);

-moz-filter: grayscale(100%);

-ms-filter: grayscale(100%);

-o-filter: grayscale(100%);

filter: grayscale(100%);

{/block:IfMonochromeImages}






}

iframe.photoset:hover {

{block:IndexPage}

{block:IfImageFade}

opacity: 0.7;

{/block:IfImageFade}

{/block:IndexPage}

cursor: crosshair;

}

ul.chat, .chat ol, .chat li {

list-style: none;

margin: 0px;

padding: 3px;

}

/* P A G I N A T I O N */

.pagination {

display: none;

}

/* C R E D I T */

#credit {

position: fixed;

right: 20px;

bottom: 20px;

font-size: 10px;






}

#credit:hover {

text-shadow: 1px 1px 1px #bebebe;

}

#dhtmltooltip {

white-space:nowrap;

font-size: 9px;

position: absolute;

padding: 3px;

text-align: center;

visibility: hidden;


color: #ffffff;

z-index: 100;

}

/* S C R O L L U P */

#scrollUp {

bottom: 40px;

right: 20px;

}

/* P E R M A L I N K S */

.perma {

font: 9px;

text-align: center;

position: relative;

opacity: 0;






}

.posts:hover .perma {

opacity: 1;

}

.perma a:hover {


{block:IfShadows}


{/block:IfShadows}

{block:IfNotShadows}

border-bottom: 2px solid #000000;

{/block:IfNotShadows}

}

.info {

width: 500px;

text-align: left;

padding-top: 50px;

position: relative;

}

/* A U D I O P O S T S */

.audio {

height: 73px;

width: 500px;

}

.cover {

position: absolute;

width: 60px;

}

.player {

width:25px;

height:25px;

overflow: hidden;

position: absolute;

z-index: 100;

margin-left: 16px;

margin-top: 16px;

}

.song {

margin-left: 70px;

line-height: 20px;

}

{CustomCSS}

</style>

$container.masonry( 'appended', $newElems, true );

});

}

);

});

</script>



<div id="dhtmltooltip"></div>

<script type="text/javascript">

/***********************************************

* Cool DHTML tooltip script- © Dynamic Drive DHTML code library (www.dynamicdrive.com)

* This notice MUST stay intact for legal use

* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code

***********************************************/

var offsetxpoint=-60 //Customize x offset of tooltip

var offsetypoint=20 //Customize y offset of tooltip

var ie=document.all

var ns6=document.getElementById && !document.all

var enabletip=false

if (ie||ns6)

var tipobj=document.all? document.all["dhtmltooltip"] : document.getElementById? document.getElementById("dhtmltooltip") : ""

function ietruebody(){

return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body

}

function ddrivetip(thetext, thecolor, thewidth){

if (ns6||ie){

if (typeof thewidth!="undefined") tipobj.style.width=thewidth+"px"

if (typeof thecolor!="undefined" && thecolor!="") tipobj.style.backgroundColor=thecolor

tipobj.innerHTML=thetext

enabletip=true

return false

}

}

function positiontip(e){

if (enabletip){

var curX=(ns6)?e.pageX : event.clientX+ietruebody().scrollLeft;

var curY=(ns6)?e.pageY : event.clientY+ietruebody().scrollTop;

//Find out how close the mouse is to the corner of the window

var rightedge=ie&&!window.opera? ietruebody().clientWidth-event.clientX-offsetxpoint : window.innerWidth-e.clientX-offsetxpoint-20

var bottomedge=ie&&!window.opera? ietruebody().clientHeight-event.clientY-offsetypoint : window.innerHeight-e.clientY-offsetypoint-20

var leftedge=(offsetxpoint<0)? offsetxpoint*(-1) : -1000

//if the horizontal distance isn't enough to accomodate the width of the context menu

if (rightedge<tipobj.offsetWidth)

//move the horizontal position of the menu to the left by it's width

tipobj.style.left=ie? ietruebody().scrollLeft+event.clientX-tipobj.offsetWidth+"px" : window.pageXOffset+e.clientX-tipobj.offsetWidth+"px"

else if (curX<leftedge)

tipobj.style.left="5px"

else

//position the horizontal position of the menu where the mouse is positioned

tipobj.style.left=curX+offsetxpoint+"px"

//same concept with the vertical position

if (bottomedge<tipobj.offsetHeight)

tipobj.style.top=ie? ietruebody().scrollTop+event.clientY-tipobj.offsetHeight-offsetypoint+"px" : window.pageYOffset+e.clientY-tipobj.offsetHeight-offsetypoint+"px"

else

tipobj.style.top=curY+offsetypoint+"px"

tipobj.style.visibility="visible"

}

}

function hideddrivetip(){

if (ns6||ie){

enabletip=false

tipobj.style.visibility="hidden"

tipobj.style.left="-1000px"

tipobj.style.backgroundColor=''

tipobj.style.width=''

}

}

document.onmousemove=positiontip

</script>



<script src="https://raw.github.com/markgoodyear/scrollup/master/js/jquery.scrollUp.min.js"></script>

<script>

$(function () {

$.scrollUp({

scrollName: 'scrollUp', // Element ID

topDistance: 300, // Distance from top before showing element (px)

topSpeed: 300, // Speed back to top (ms)

animation: 'fade', // Fade, slide, none

animationInSpeed: 200, // Animation in speed (ms)

animationOutSpeed: 200, // Animation out speed (ms)

scrollText: 'back', // Text for element

scrollImg: false, // Set true to use image

activeOverlay: false, // Set CSS color to display scrollUp active point, e.g '#00FFFF'

});

});

</script>



<script>

window.onload = function () {

$('.video iframe').attr('height', '112');

});

</script>

{/block:If4Columns}



</head>

<body>

<div id="header">

<a href="/" id="title">{Title}</a>

<div id="nav">

<p><a href="/">Home</a> <a href="/ask">Message</a> <a href="/archive">Archive</a></p>

{block:IfCustomLinks}<p><a href="{text:URL 1}" target="_blank" onMouseover="ddrivetip('{text:Link 1}')";

onMouseout="hideddrivetip()">i.</a> <a href="{text:URL 2}" target="_blank" onMouseover="ddrivetip('{text:Link 2}')";

onMouseout="hideddrivetip()">ii.</a> <a href="{text:URL 3}" target="_blank" onMouseover="ddrivetip('{text:Link 3}')";

onMouseout="hideddrivetip()">iii.</a> <a href="{text:URL 4}" target="_blank" onMouseover="ddrivetip('{text:Link 4}')";

onMouseout="hideddrivetip()">iv.</a></p>{/block:IfCustomLinks}

</div>

</div>

<div id="content">

{block:Posts}

<div class="posts">

{block:Text}

{block:Title}<h1><a href="{Permalink}">{Title}</a></h1>{/block:Title}

{Body}

{block:IndexPage}

<div class="perma">

<p><a href="{Permalink}">{NoteCount}</a></p>

</div>

{/block:IndexPage}

{/block:Text}

{block:Photo}

{block:IndexPage}

{block:If4Columns}

<a href="{Permalink}"><img src="{PhotoURL-250}" alt="{PhotoAlt}" width="200px"/></a>

{/block:If4Columns}

{block:If3Columns}

<a href="{Permalink}"><img src="{PhotoURL-250}" alt="{PhotoAlt}" /></a>

{/block:If3Columns}

{block:If2Columns}

<a href="{Permalink}"><img src="{PhotoURL-500}" alt="{PhotoAlt}" /></a>

{/block:If2Columns}

{block:IfCaptions}

{block:Caption}{Caption}{/block:Caption}

{/block:IfCaptions}

{/block:IndexPage}


{LinkOpenTag}

<img src="{PhotoURL-500}" alt="{PhotoAlt}"/>

{LinkCloseTag}



{/block:Photo}

{block:Photoset}

{block:IndexPage}

{block:If4Columns}

{Photoset-250}

{/block:If4Columns}

{block:If3Columns}

{Photoset-250}

{/block:If3Columns}

{block:If2Columns}

{Photoset-500}

{/block:If2Columns}

{/block:IndexPage}


{Photoset-500}


{block:IfCaptions}


{/block:IfCaptions}

{block:IndexPage}

<div class="perma">


</div>

{/block:IndexPage}

{/block:Photoset}

{block:Quote}

<h1><p><a href="{Permalink}">{Quote}</a></p></h1>

<center><p>– {Source}</p></center>

{block:IndexPage}

<div class="perma">


</div>

{/block:IndexPage}

{/block:Quote}

{block:Link}

<a href="{URL}"><h1>» {Name}</h1></a>

{block:Description}<p>{Description}</p>{/block:Description}

{block:IndexPage}

<div class="perma">


</div>

{/block:IndexPage}

{/block:Link}

{block:Answer}

<p><center>{Asker} said: <h1>{Question}</h1></p>

<p><i>{Answer}</i></p></center>

{block:IndexPage}

<div class="perma">


</div>

{/block:IndexPage}

{/block:Answer}

{block:Video}

{block:IndexPage}

{block:If4Columns}

<div class="video">{Video-250}</div>

{/block:If4Columns}

{block:If3Columns}

{Video-250}

{/block:If3Columns}

{block:If2Columns}

{Video-500}

{/block:If2Columns}

{/block:IndexPage}


{Video-500}


{block:IfCaptions}


{/block:IfCaptions}

{block:IndexPage}

<div class="perma">


</div>

{/block:IndexPage}

{/block:Video}

{block:Audio}

<div class="audio">

{block:AlbumArt}<img class="cover" src="{AlbumArtURL}">{/block:AlbumArt}

<div class="player">{block:AudioPlayer}{AudioPlayerBlack}{/block:AudioPlayer}</div>

<div class="song">

{block:TrackName}<b>Title:</b> {TrackName}<br>{/block:TrackName}

{block:Artist}<b>Artist:</b> {Artist}<br>{/block:Artist}

{block:Album}<b>Album:</b> {Album}<br>{/block:Album}

</div>

</div>

{block:IndexPage}

<div class="perma">


</div>

{/block:IndexPage}

{/block:Audio}

{block:Chat}

<ul class="chat">

{block:Title}<h1><a href="{Permalink}">{Title}</a></h1>{/block:Title}

{block:Lines}

<li>

{block:Label}<b><span style="text-transform:uppercase;">{Label}</span></b>{/block:Label} {Line}

</li>

{/block:Lines}

</ul>

{block:IndexPage}

<div class="perma">


</div>

{/block:IndexPage}

{/block:Chat}


<div class="info">

<p>{block:Date}Date: {DayofMonth}{DayofMonthSuffix} {Month}, {24Hour}:{Minutes}{/block:Date}</p><p>{block:NoteCount}Notes: {NoteCount}{/block:NoteCount}</p><p>{block:HasTags}Tags: {block:Tags}<a href="{TagURL}">#{Tag}</a> {/block:Tags}{/block:HasTags}</p>

</div>


</div>



{block:ContentSource}



{/block:ContentSource}

{/block:Posts}

{block:TagPage}

<h1><small>posts tagged with <i>{Tag}</i></small></h1>

{/block:TagPage}

</div>

<div class="pagination">

{block:Pagination}{block:PreviousPage}<a href="{PreviousPage}">previous</a> ·{/block:PreviousPage} {block:NextPage}<a href="{NextPage}" id="next">next</a>{/block:NextPage}{/block:Pagination}

</div>

<div id="credit"><a href="http://filmingthemes.tumblr.com/" target="_blank" onMouseover="ddrivetip('theme by filmingthemes')";

onMouseout="hideddrivetip()">+</a></div>

</body>

</html>

Theme for tumblr

Documents

Transcript of Theme for tumblr