If you want to request anything leave me a message.
-
Click
what are you trying to do?
So i have receive a bunch questions about pop up box in step 4 (where you should put the link code) and i’m sorry for the poor explaining before :P.
Ok. After done with step 1-3 u need to find your ask link, if your theme already come with ask link, go to customize > edit html > find the tags <a href="/ask">
Replace the highlight link with this link:
<a href="#?w=500" rel="03" class="poplight"TITLE</a>
** if you put your ask link in your description, just follow the tutorial
1. After change your URL, you have to make a new blog with your old URL.
2. Go to this site and copy all the code: http://pastebin.com/raw.php?i=JH5YxfyH
3. Click you blog name » Go to Customize appearance » and follow the instruction below.
4. Click save and look at you page.
1. Copy and paste the code BEFORE </head> tags
<style>
.shakeimage{
position:relative
}
</style>
<script language="JavaScript1.2">
/*
Shake image script (onMouseover)-
� Dynamic Drive (www.dynamicdrive.com)
For full source code, usage terms, and 100's more DHTML scripts, visit http://dynamicdrive.com
*/
//configure shake degree (where larger # equals greater shake)
var rector=3
///////DONE EDITTING///////////
var stopit=0
var a=1
function init(which){
stopit=0
shake=which
shake.style.left=0
shake.style.top=0}
function rattleimage(){
if ((!document.all&&!document.getElementById)||stopit==1)
return
if (a==1){
shake.style.top=parseInt(shake.style.top)+rector+"px"}
else if (a==2){
shake.style.left=parseInt(shake.style.left)+rector+"px"}
else if (a==3){
shake.style.top=parseInt(shake.style.top)-rector+"px"}
else{
shake.style.left=parseInt(shake.style.left)-rector+"px"}
if (a<4)
a++
else
a=1
www.dynamicdrive.com)
For full source code, usage terms, and 100's more DHTML scripts, visit http://dynamicdrive.com
*/
//configure shake degree (where larger # equals greater shake)
var rector=3
///////DONE EDITTING///////////
var stopit=0
var a=1
function init(which){
stopit=0
shake=which
shake.style.left=0
shake.style.top=0}
function rattleimage(){
if ((!document.all&&!document.getElementById)||stopit==1)
return
if (a==1){
shake.style.top=parseInt(shake.style.top)+rector+"px"}
else if (a==2){
shake.style.left=parseInt(shake.style.left)+rector+"px"}
else if (a==3){
shake.style.top=parseInt(shake.style.top)-rector+"px"}
else{
shake.style.left=parseInt(shake.style.left)-rector+"px"}
if (a<4)
a++
else
a=1
setTimeout("rattleimage()",50)}
function stoprattle(which){
stopit=1
which.style.left=0
which.style.top=0}
</script>
2. Paste the code in Image Post Section:
class="shakeimage" onMouseover="init(this);rattleimage()" onMouseout="stoprattle(this);top.focus()" onClick="top.focus()"
- find the <div id=”posts”> tags or <div id=”content”>
- then find {block:Photo} section
- then find <a href=”{Permalink}”> tags.
- Place the code in <a href=”{Permalink}”> tags
3. Save and look at your page, you can’t see your image shake on customize.
** if not working, try copy and replace the 1st code from here: http://aamandaricka.pastebay.com/136167
1. Copy and paste the code below right after <head> tags.
<script type="text/javascript"
src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
<script>
$(document).ready(function() {
//
$('a.poplight[href^=#]').click(function() {
var popID = $(this).attr('rel'); //Get Popup Name
var popURL = $(this).attr('href'); //Get Popup href to define size
var query= popURL.split('?');
var dim= query[1].split('&');
var popWidth = dim[0].split('=')[1]; //Gets the first query string value
$('#' + popID).fadeIn().css({ 'width': Number( popWidth ) }).prepend('<a href="#" class="close"><img src="http://png.findicons.com/files/icons/1714/dropline_neu/24/dialog_close.png" class="btn_close" title="Close" alt="Close" /></a>');
var popMargTop = ($('#' + popID).height() + 80) / 2;
var popMargLeft = ($('#' + popID).width() + 80) / 2;
//Apply Margin to Popup
$('#' + popID).css({
'margin-top' : -popMargTop,
'margin-left' : -popMargLeft
});
$('body').append('<div id="fade"></div>');
$('#fade').css({'filter' : 'alpha(opacity=80)'}).fadeIn(); //Fade in the fade layer - .css({'filter' : 'alpha(opacity=80)'})
return false;
});
$('a.close, #fade').live('click', function() {
$('#fade , .popup_block').fadeOut(function() {
$('#fade, a.close').remove(); //fade them both out
});
return false;
});
});
</script>
**the highlighted is a image of “close” button. if you want change the image just replace with your url of image or you can choose here
2. Paste this code under <style type=”text/css”> tags
.popup_block{
display: none;
background: #D3D3D3;
background-image: url();
padding: 10px;
font-family: Garamond;
float: left;
font-size: 10px;
position: fixed;
top: 50%; left: 50%;
z-index: 2;
border: 2px solid #363636;
-moz-box-shadow: 0 0 5px #CFCFCF;
-webkit-box-shadow: 0 0 5px #CFCFCF;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
}
img.btn_close {
float: right;
margin: -5px -5px 0 0;
}
*html .popup_block {
position: absolute;
}
** if you want to customize your ask box, just change what you want, i already highlight the tags of color. you can insert image background if you like, just put the url between (url)
3. paste this code after </body> tags.
<div id="02" class="popup_block"> <Center><font size="5" color="#1C1C1C">Ask Me Anything<p></font><iframe frameborder="0" scrolling="yes" width="100%" height="150" src="http://www.tumblr.com/ask_form/USERNAME.tumblr.com" style="background-color:transparent; overflow:hidden;" id="ask_form"> </center></div> </div></div></div></div></div></div></div></div></div></div>
** make sure you replace the USERNAME wit your username!
4. Change the code of your “ask” link to this code.
<a href="#?w=500" rel="02" class="poplight">ask me</a>
** change the “ask me” to title of your ask link
PLEASE FOLLOW THE INSTRUCTION CAREFULLY. FEEL FREE TO ASK ME IF YOU HAVE PROBLEM WITH IT.
** you can see example for this code on http://sneakerslicious.tumblr.com/
just click the “ask me” link- Put the code between <head> and </head> tags
- Change the image url to image url you want.
- You can find another glitter at here
<style type="text/css">a:hover{background:url('http://dl9.glitter-graphics.net/pub/80/80039njfma9svnd.gif');}hr{background-image:url('http://dl9.glitter-graphics.net/pub/80/80039njfma9svnd.gif'); </style>
