Pop Up Ask Box on Your Main Page
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
CHECK THIS FOR EXTRA EXPLANATION WITH STEP 4
PLEASE FOLLOW THE INSTRUCTION CAREFULLY. FEEL FREE TO ASK ME IF YOU HAVE PROBLEM WITH IT.
Source: academyoftumblr
425 Notes/ Hide
-
teamsplush likes this
-
scarlettitaniaft likes this
-
pasawaynabubuyog likes this
-
maracoil likes this
-
eim-group reblogged this from academyoftumblr
-
ubosurl reblogged this from academyoftumblr
-
chanqijoe likes this
-
deathalsohurts likes this
-
soft-wind likes this
-
yoda-oneforme likes this
-
qerman likes this
-
gigiguhyun likes this
-
resourceme reblogged this from academyoftumblr
-
twatco-b3ll likes this
-
aami likes this
-
prrior likes this
-
toki-doki likes this
-
teensarebeauty likes this
-
missjodee likes this
-
portuquese likes this
-
jhalliday100 reblogged this from academyoftumblr
-
jhalliday100 likes this
-
icantbelieveitsnotdoitsu reblogged this from academyoftumblr
-
wooden--dreamer likes this
-
luhan-sexy likes this
-
liferemainsdark likes this
-
justlittletrifles likes this
-
hazzamazayn likes this
-
notgomen likes this
-
the-devil-is-a-woman likes this
-
recovred likes this
-
unionjjsmonkey likes this
-
tomlilnsun likes this
-
sugarskullss likes this
-
hohosketch likes this
-
genocidercyo likes this
-
1nhale-4drenaline likes this
-
5hip likes this
-
tomlinstyls likes this
-
followyour-dreamss likes this
-
unsoberly likes this
-
hijiribe likes this
-
blackiesbrasil likes this
-
keir-reviews likes this
-
s-ehunnie likes this
-
taemin-ci likes this
-
qold-rush likes this
-
listenly likes this
-
kiyonu likes this
-
placstic likes this
- Show more notes
