The forum of the forums
Welcome to the Official Support Forum of Forumotion!

To take full advantage of everything offered by our forum, please log in if you are already a member, or join our community if you've not yet.



Create a free forum like this one.

dohtml codes. can I move it in post?

View previous topic View next topic Go down

dohtml codes. can I move it in post?

Post by delicious on January 10th 2014, 9:06 pm

hello Smile I found realy great codes to everything. like this:
Spoiler:
<style type="text/css">
#gallery { width: 400px; height: 575px; overflow: hidden; background-image: url(http://i.imgur.com/79gnntr.png); }
#gallery #title { height: 15px; width: 60px; margin-top: 260px; z-index: 10; background-color: white; padding: 20px; font: italic 10px times; letter-spacing: 3px; opacity: 1; transition: 0.8s; -moz-transition: 0.8s; -webkit-transition: 0.8s; -o-transition: 0.8s; }
#one, #two, #three, #four, #five, #six, #seven, #eight, #nine, #ten { background-color: white; color: #3e4f65; font-family: georgia; font-size: 8.5px; letter-spacing: 0px; position: absolute; padding: 20px 10px 10px 10px; width: 160px; margin: 15px -20px; height: 65px; overflow: auto; opacity: 0; text-align: justify; transition: 0.8s; -moz-transition: 0.8s; -webkit-transition: 0.8s; -o-transition: 0.8s; }
#two { margin: 127px 50px; }
#three { margin: 240px -20px; }
#four { margin: 353px 50px; }
#five { margin: 466px -20px; }
#ten { margin: 15px 180px; }
#six { margin: 127px 250px; }
#seven { margin: 240px 180px; }
#eight { margin: 353px 250px; }
#nine { margin: 466px 180px; }

::-webkit-scrollbar { height: 5px; width: 5px; }
::-webkit-scrollbar-track { background-color: #3e4f65; }
::-webkit-scrollbar-thumb { background-color: #98a4ae; }

#gallery:hover #title { opacity: 0; }
#gallery:hover #one { opacity: 1; transition-delay:0.2s; margin: 15px; }
#gallery:hover #two { opacity: 1; transition-delay:0.4s; margin: 127px 15px; }
#gallery:hover #three { opacity:1; transition-delay:0.6s; margin: 240px 15px; }
#gallery:hover #four { opacity:1; transition-delay:0.8s; margin: 353px 15px; }
#gallery:hover #five { opacity:1; transition-delay:1.0s; margin: 466px 15px; }
#gallery:hover #ten { opacity:1; transition-delay:1.2s; margin: 15px 207px; }
#gallery:hover #six { opacity:1; transition-delay:1.4s; margin: 127px 207px; }
#gallery:hover #seven { opacity:1; transition-delay:1.6s; margin: 240px 207px; }
#gallery:hover #eight { opacity:1; transition-delay:1.8s; margin: 353px 207px; }
#gallery:hover #nine { opacity:1; transition-delay:2.0s; margin: 466px 207px; }

.header { background-color: #3e4f65; color: white; letter-spacing: 1px; font-size: 8px; position: absolute; text-align: center; width: 100%; padding: 3px 0 3px 10px; margin: -20px -20px 0px -20px; text-transform: uppercase; }
</style>
<center>

<div id="gallery">

<div id="title">
hover
</div>

<div style="margin-top: -315px;">

<div id="one" style="width: 350px;">

<div class="header">
about autumn
</div>
I'm Autumn but you can call me Minnie~ Autumn's just an alias but it's such a pretty name! I love too too much! I'm known under multiple names but for now, I'm just Autumn! I'm seventeen, living in New York City, in my senior year! These codes are just things I like doing in my spare time and I hope you enjoy them! If you have any questions about them, feel free to PM me!
</div>

<div id="two">

<div class="header">
plotters / want ads
</div>
<a href="http://z10.invisionfree.com/CAUTIONTOTHEWIND/index.php?showtopic=195888">path of a lightning bolt</a> -- with hover and reply<br />
</div>

<div id="three">

<div class="header">
threads
</div>
<a href="http://z10.invisionfree.com/CAUTIONTOTHEWIND/index.php?showtopic=196016">light a cigarette</a> -- simple with scroll/no scroll options<br /> <a href="http://z10.invisionfree.com/CAUTIONTOTHEWIND/index.php?showtopic=196191">took a pill or maybe two</a> -- simple with hover<br />
</div>

<div id="four">

<div class="header">
technology
</div>
<a href="http://z10.invisionfree.com/CAUTIONTOTHEWIND/index.php?showtopic=196369">where the church bells cry</a> -- black iphone 5 for texts<br />
</div>

<div id="five">

<div class="header">
site necessities
</div>
<a href="http://z10.invisionfree.com/CAUTIONTOTHEWIND/index.php?showtopic=196078">eyes of apple green</a> -- mini profile with hover<br />
</div>

<div id="six">

<div class="header">
signatures
</div>
<a href="http://z10.invisionfree.com/CAUTIONTOTHEWIND/index.php?showtopic=196346">old rusty guitar</a> -- with links and mp3<br />
</div>

<div id="seven">

<div class="header">
instant messengers
</div>
<a href="http://z10.invisionfree.com/CAUTIONTOTHEWIND/index.php?showtopic=196301">making up the pavement</a> -- simple<br />
</div>

<div id="eight">

<div class="header">
miscellaneous
</div>
Coming soon! I promise!<br />
</div>

<div id="nine">

<div class="header">
skins
</div>
Coming soon! I promise!<br />
</div>

</div>

</div>
</center>
<link type="text/css" rel="stylesheet" href="http://fonts.googleapis.com/css?family=Roboto:400,100" /><style type="text/css">
.imagine-dragons {
background-image:url(http://img405.imageshack.us/img405/1051/k8i8.png);
width:303px;
height:632;
overflow:hidden;
}
.imagine-monsters {
width:237px;
height:350px;
background-image:url(http://placehold.it/237x350);
transition:All 1s ease-in-out;
-webkit-transition:All 1s ease-in-out;
-moz-transition:All 1s ease-in-out;
-o-transition:All 1s ease-in-out;
}
.imagine-radioactive {
width:227px;
font-family:roboto;
font-size:10px;
text-align:center;
background-color:rgba(255,255,255,0.6);
color:#cccccc;
text-transform:uppercase;
padding:5px;
transition:All 1s ease-in-out;
-webkit-transition:All 1s ease-in-out;
-moz-transition:All 1s ease-in-out;
-o-transition:All 1s ease-in-out;
}
.imagine-demons {
width:235px;
height:421px;
overflow:hidden;
margin-left:1px;
margin-top:103px;
}
.imagine-bleedingout {
width:0px;
height:0px;
margin-left:-300px;
margin-top:100px;
transition:All 1s ease-in-out;
-webkit-transition:All 1s ease-in-out;
-moz-transition:All 1s ease-in-out;
-o-transition:All 1s ease-in-out;
}
.imagine-dragons:hover .imagine-radioactive {
margin-top:-20px;
}
.imagine-dragons:hover .imagine-monsters {
margin-top:-400px
}
.imagine-dragons:hover .imagine-bleedingout {
width:237px;
height: 421px;
margin-top:50px;
background-image:url(http://i.imgur.com/2acWg0s.png);
margin-left:1px;
}
.imagine-dragons:hover .imagine-itstime {
width:162px;
text-align:justify;
background-color:#0680ff;
padding:10px;
transition:All 1s ease-in-out;
-webkit-transition:All 1s ease-in-out;
-moz-transition:All 1s ease-in-out;
-o-transition:All 1s ease-in-out;
margin-left:43px;
opacity:1;
-webkit-border-top-left-radius: 50px;
-webkit-border-top-right-radius: 50px;
-webkit-border-bottom-left-radius: 50px;
-moz-border-radius-topleft: 50px;
-moz-border-radius-topright: 50px;
-moz-border-radius-bottomleft: 50px;
border-top-left-radius: 50px;
border-top-right-radius: 50px;
border-bottom-left-radius: 50px;
max-height:237;
overflow:auto;
}
.imagine-itstime {
width:0px;
opacity:0;
text-align:justify;
background-color:#0680ff;
padding:0px;
transition:All 1s ease-in-out;
-webkit-transition:All 1s ease-in-out;
-moz-transition:All 1s ease-in-out;
-o-transition:All 1s ease-in-out;
font-family:calibri;
font-size:11px;
color:#fcfcfc;
}
.remember-thename {
font-family:roboto;
font-size: 14px;
text-align:center;
color:#191919;
}
.codesbymerc {
font-family:calibri;
font-size:10px;
color:#191919;
margin-top:-23px;
}
.codesbymerc a {
text-decoration:none;
margin-top:-15px;
}
</style>
<center>
<div class="imagine-dragons">
<div class="imagine-demons">
<div class="imagine-monsters">
<div class="imagine-radioactive">
1 new message
</div>
</div>
<div class="imagine-bleedingout">
<div style="padding-top:25px;">
</div>
<div class="remember-thename">
kelly
</div>
<div style="padding-top:55px;">
</div>
<div class="imagine-itstime">
hey hey hey this is what a text is going to look like.
</div>
<div class="imagine-cherry">
</div>
</div>

</div>
</div>
<div class="codesbymerc">
<a href="http://z10.invisionfree.com/CAUTIONTOTHEWIND/index.php?showuser=37282">THANKS</a><a href="http://z10.invisionfree.com/A_THOUSAND_FIREFLIES/index.php?showuser=9524">MERC</a>
</div>
</center>
it's looks like here: http://soothemysoul.forumlt.com/
and that cell phone. Now I add codes to Generalities, its looks beautifull here. But when I want somehow move all these things to post, happens that: (I even take from that codes css and add to my css codes)
http://i.imgur.com/mGOXuVv.png
http://i.imgur.com/YiWn86i.png
all picture become that mess. I trying to somehow fix this, but maybe its is secret or idk Very Happy how fix this, cuz I really want take these wonderfull codes

delicious
Forumember

Female Posts : 213
Reputation : 1
Language : lithuanian

http://wildchild.forumlt.com/

Back to top Go down

Re: dohtml codes. can I move it in post?

Post by delicious on January 11th 2014, 3:48 pm

bump

delicious
Forumember

Female Posts : 213
Reputation : 1
Language : lithuanian

http://wildchild.forumlt.com/

Back to top Go down

Re: dohtml codes. can I move it in post?

Post by delicious on January 14th 2014, 9:35 pm

bump

delicious
Forumember

Female Posts : 213
Reputation : 1
Language : lithuanian

http://wildchild.forumlt.com/

Back to top Go down

View previous topic View next topic Back to top


 
Permissions in this forum:
You cannot reply to topics in this forum