The Codes Club @thecodesclub-blog - Tumblr Blog

i cant find the body tag on my html! so confusing! can you maybe screenshot where it is?

ctrl+f then search

(:

for narnia theme how do i put in a glitter photo hover? x

here:

.post img:hover {border: 5px solid; /* you can change how thick it is by changing the 5 */-moz-border-image: url(PUTYOURIMAGEURLHERE); /* put in the photo url of the glitter you would want inside the parentheses */-o-border-image:url(PUTYOURIMAGEURLHERE); /* put in the same image url here and below */border-image: url(PUTYOURIMAGEURLHERE); }

you can change around what anything there with what i posted :) x

#narnia #photo hover #photos #pics #pic hover #glitter border #qs #hover border #narnia hove #narnia hover #photo glitter #photos effect #photos effects

Super cool original text effects!

PREVIEW THE TEXT EFFECTS HERE so this is the CSS markups and styles for the text effects- pastte them under the tags on your theme for the effect. p;ease credit me as i made some of them :)

text-shadow: -10px 10px 0px #00e6e6, -20px 20px 0px #01cccc, -30px 30px 0px #00bdbd;

text-shadow: 0px 1px 0px #999, 0px 2px 0px #888, 0px 3px 0px #777, 0px 4px 0px #666, 0px 5px 0px #555, 0px 6px 0px #444, 0px 7px 0px #333, 0px 8px 7px #001135;

text-shadow: 0 6px 4px #33F, -3px -5px 4px #F00, 3px -5px 4px #0F0;

text-shadow: 0px 2px 0px #999, 0px 2px 0px #888, 0px 3px 0px #777, 0px 4px 0px #666, 0px 4px 0px #555, 0px 5px 0px #444, 0px 6px 0px #333, 0px 7px 6px #001135;

-webkit-text-stroke:1px transparent; text-shadow:4px 5px 0px rgba(0,0,0,0.1),4px -6px 0px rgba(0,0,0,0.2),6px 12px 0px rgba(0,0,0,0.1),-8px 5px 0px rgba(0,0,0,0.2),-3px -8px 0px rgba(0,0,0,0.15);

text-shadow:31px -24px 7px #e33f97,-48px -24px 7px #603fe3,-48px 13px 7px #3fdee3,-48px 13px 35px #393d3d,15px 14px 7px #6ff768,34px 1px 7px #f7ab68;

text-shadow:-4px 2px 0px #ff0000; color: #5900ff;

#text #text effects #tutorials #tutorial #text effect #css #effect #texts #shadows #css shadows #fun with shadows #css shadow #text shadow #text shadows

is this the same person who runs neon-themes? xx

neon-themes is actually 3 people-ally, jaime, and riley :) no, this is not the same people xx

Cool Skew and Grow ORIGINAL popup animation!

LIVE PREVIEW IT HERE!

Paste this code after the <head> tag.

Then, paste this after </body>:

To activate it, put this link where you want the popup to be:

#popup ask #pop up ask #ask box animation #tutorials #tutorial #ask animation #popup animation #popup animations

Headline Font Pack by thecodesclub!

DOWNLOAD HERE

#fonts #font #font pack

hey i love your new theme but its a little cluttered on a windows browser fyi :)

oh my god thank you so much! i really appreciate your feedback ill see if i can fix it! xx

Instagram photo effect with pure coding!

1. Paste this code before your /style> tag:

.insta { -webkit-box-shadow: inset 0px 0px 100px rgba(0,0,20,1); background: -webkit-linear-gradient(top, rgba(255,145,0,0.2) 0%,rgba(255,230,48,0.2) 60%), -webkit-linear-gradient(20deg, rgba(255,0,0,0.5) 0%,rgba(255,0,0,0) 35%); display: table; } .insta img { -webkit-filter: sepia(20%) brightness(10%) contrast(130%); position: relative; z-index: -1; }

2. Wherever you want the photo effect to be, paste this after the

#tutorials #instagram effect #instagram #insta #retro #vignette effect #photo effect #photo #photos #images #image effect

Super cool rolling gradient link!

Check out this super cool pure css link gradient hover!

LIVE PREVIEW

1. Paste this after /style:

a {

color: blue;

text-decoration: none;

text-transform: uppercase;

-webkit-transition: 2s;

}

a:hover {

color: hotPink;

}

@media (-webkit-min-device-pixel-ratio:0) {

a {

background-color: skyBlue;

background-image: -webkit-linear-gradient(left, hotPink 0%, orange 50%, transparent 50%);

background-position: 100% 0;

background-size: 200% 200%;

color: transparent;

-webkit-transition: 1s .2s;

-webkit-background-clip: text;

}

a:hover {

background-position: 0 0;

color: transparent;

transition: 2s 0;

}

2. This effect will only work on links. Enjoy!

#tutorials #link hover #links #links hover #gradients #text effect #texts #effects #text #effect

Cool Sliding Box!

LIVE PREVIEW IT HERE

1. Paste this above the /style> tag in your code:

#slidingbox {

margin-top: 20%;

margin-left: -20px;

overflow: hidden;

width: 150px;

height: 100px;

border-style: solid;

border-radius: 10px;

border-width: 1px;

font-size: 14px;

position: fixed;

color: #222222;

font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;

-webkit-transition-duration: 0.8s;

-o-transition-duration: 0.8s;

-moz-transition-duration: 0.8s;

}

#slidingbox:hover {

width: 600px;

-webkit-transition-duration: 0.8s;

-o-transition-duration: 0.8s;

-moz-transition-duration: 0.8s;

}

2. Paste this after the <body tag:

<center> hey so this is your super cute text here :) </center>

</div>

3. Fill in the styles to change the image and change the text to what you want! Super easy and super cute!

:)

#sliding box #slideout #slide #slide out #sliding #box #tab #menu #navigation #tutorial

Famous Font Pack Theme made for you by thecodesclub :) Please like if using x

DOWNLOAD HERE

#font #fonts #font pack #fontpack #famous font #logo #famous #bands #groups #group #free fonts #resources #resource #font resource

Image Reflection Code

paste this code under the /style> tag.

#posts img:hover { opacity: 1; -webkit-box-reflect: below 0px -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(.7, transparent), to(rgba(0,0,0,0.4))); }

#images #image #reflection #mirro #mirror #code #codes #photo #photos #post #posts #post reflect #reflect #tutorial

Welcome to the codesclub!

I'll be posting new tutorials alot :) Stay tuned!

Trending Blogs

Recently Viewed Blogs

The Codes Club