Full Version: HTML Effects
Is there a way to create rollover images in your LiveJournal?
There is, as in the effects on mine:
http://lyricalib.livejournal.com
Basically, this is the CSS (in the style tags for GLOBAL_HEAD) that I used for JUST the first link, I had to copy it for each one:
And then this goes in LASTN_WEBSITE:
I used absolute positioning, can you kinda see what I did or do you need more explanation? Sorry, kinda posting in a rush but if you'll let me know how much sense that makes to you, I'll have more time to sit down and explain it later on.
http://lyricalib.livejournal.com
Basically, this is the CSS (in the style tags for GLOBAL_HEAD) that I used for JUST the first link, I had to copy it for each one:
CODE
.roll1 a{
background-image: url(http://img.photobucket.com/albums/0903/Libertie/Live%20Journal/pink/link1.png);
width:23px;
height:19px;
display:block;
visibility:visible;
}
.roll1 a:hover{
background-image: url(http://img.photobucket.com/albums/0903/Libertie/Live%20Journal/pink/link1_roll.png);
width:23px;
height:19px;
display:block;
visibility:visible;
}
background-image: url(http://img.photobucket.com/albums/0903/Libertie/Live%20Journal/pink/link1.png);
width:23px;
height:19px;
display:block;
visibility:visible;
}
.roll1 a:hover{
background-image: url(http://img.photobucket.com/albums/0903/Libertie/Live%20Journal/pink/link1_roll.png);
width:23px;
height:19px;
display:block;
visibility:visible;
}
And then this goes in LASTN_WEBSITE:
CODE
<span class="roll1" style="position: absolute; left: 50%; top: 49px; margin-left: 52px;"><a href="http://lyricalib.livejournal.com"></a></span>
I used absolute positioning, can you kinda see what I did or do you need more explanation? Sorry, kinda posting in a rush but if you'll let me know how much sense that makes to you, I'll have more time to sit down and explain it later on.
This is a "lo-fi" version of our main content. To view the full version with more information, formatting and images, please click here.