Deviant Login Shop
 Join deviantART for FREE Take the Tour
×



Details

Submitted on
January 11
File Size
1.9 KB
Link
Thumb
Embed

Stats

Views
1,093 (3 today)
Favourites
66 (who?)
Comments
12
Installs
84
×
Big Thumb Hover CSS Snippet by SimplySilent Big Thumb Hover CSS Snippet by SimplySilent
:points: Commission Me | Journal Skins | Gallery Skins | Create your own Journal Skins!

Stamp: Yes if Fav and Credit by SimplySilent Live Version


CSS Snippet created for TheGalleryOfEve, who wanted to know how to create thumbs similar to those used in features at devPREMIUM. I tried to make the format as simple as possible to use, but there's still a lot of HTML code that needs to be copy and pasted for each thumb.

Features

  • Uses :bigthumb: codes instead of embedded thumbs (see that version here)
  • Easy-to-use three column format for quickly creating professional-looking features
  • Easy customization for the font and color of the Title and Artist section


How To Use

  1. Install this skin by clicking the "Install" button on the right hand side of this page.
  2. From Sta.sh, click the blue "Edit Skin" link and open up the CSS code.
  3. Copy everything in the main "Skin CSS" section.
  4. Paste this code at the bottom of the CSS of a Journal Skin and Save.
  5. Use the example HTML given in the "Header CSS" section of this skin to format the HTML for your feature.

More Code Snippets


Embedded Hover CSS Snippet by SimplySilentSimple and Clean Thumbs Snippet by SimplySilent Mini Thumb Gallery Code Snippet by SimplySilent 
Add a Comment:
 
:iconwandereratheart:
WandererAtHeart Featured By Owner Jan 16, 2014
Would it be possible to use the journal on your profile page without using the profile widget, to make it look like it's in a custom box?
Reply
:iconsimplysilent:
SimplySilent Featured By Owner Jan 16, 2014
Do you mean using it as though it's a journal? I don't see why not. :)
Reply
:iconwandereratheart:
WandererAtHeart Featured By Owner Jan 16, 2014
I don't really know how to explain it haha. I mean like on the devpremium home page, where it has pretty much the same format for displaying images, is it possible to alter this code a bit to use it in a custom box? I like how it has the hover effect and link effect.

The more I think about it the more I feel like this is going to be a really simple answer like just take the code from the heading css, but I'm still pretty new to coding so idk lol
Reply
:iconsimplysilent:
SimplySilent Featured By Owner Jan 16, 2014
Ahh, well they feature it using an actual journal. There's only one way to add CSS to custom boxes (which would allow for these hover effects), but dA cuts of the height of the display at 350px, which would make the feature rather useless. :XD:

If you want something like this on  a profile, I would stick to using it through a journal. :)
Reply
:iconwandereratheart:
WandererAtHeart Featured By Owner Jan 16, 2014
alright thanks :)
Reply
:iconwandereratheart:
WandererAtHeart Featured By Owner Jan 16, 2014
Sorry, I didn't mean "look like it's in a custom box" I meant to actually put the journal in a custom box
Reply
:iconkovowolf:
KovoWolf Featured By Owner Jan 14, 2014  Professional General Artist
This is awesome :) I've been playing around with these as well in some of my own skins! super fun!
Reply
:iconsimplysilent:
SimplySilent Featured By Owner Jan 19, 2014
Awesome, glad you like it~ :la:
Reply
:iconginryuzaki:
Ginryuzaki Featured By Owner Jan 13, 2014
This is incredible! Thank you for sharing~! :hug::heart:
Reply
:iconsimplysilent:
SimplySilent Featured By Owner Jan 19, 2014
Not a problem! I'm trying to see if there's anyway I could do this with less HTML, but I'll have to tinker some more. :D
Reply
Add a Comment: