1. Advertising
    y u no do it?

    Advertising (learn more)

    Advertise virtually anything here, with CPM banner ads, CPM email ads and CPC contextual links. You can target relevant areas of the site and show ads based on geographical location of the user if you wish.

    Starts at just $1 per CPM or $0.10 per CPC.

Shadow effect

Discussion in 'CSS' started by Dazed_and_confused, Jan 24, 2006.

  1. #1
    Dazed_and_confused, Jan 24, 2006 IP
  2. T0PS3O

    T0PS3O Feel Good PLC

    Messages:
    13,219
    Likes Received:
    777
    Best Answers:
    0
    Trophy Points:
    0
    #2
    I don't see it there. Do you want it IN the image or around the image? Around can easily be done with CSS.
     
    T0PS3O, Jan 24, 2006 IP
  3. dave487

    dave487 Peon

    Messages:
    701
    Likes Received:
    20
    Best Answers:
    0
    Trophy Points:
    0
    #3
    If you want a script to actually alter the image you will need to use the gd library (or Paintshop).

    If you just need to change how the image looks on the page you need css like tops said.
     
    dave487, Jan 24, 2006 IP
  4. stuw

    stuw Peon

    Messages:
    702
    Likes Received:
    44
    Best Answers:
    0
    Trophy Points:
    0
    #4
    they use this css to do it:

    /* --Inline thumbnails------------------- */
    .shadow-holder {
    display:inline-table;
    }
    .shadow {
    display:block;
    padding:6px 9px 9px 6px;
    background-repeat:no-repeat;
    background-position:center;
    text-align:center;
    }
    .shadow:before {
    display:none;
    content:"nul";
    background-image:url("http://sh.deviantart.com/shadow/alpha-000000/5.1-0.6");
    }
    * html .shadow {
    /** Apparently IE will store nonsense attributes like this. Good news for scripting. */
    shadow-image:url("http://sh.deviantart.com/shadow/alpha-000000/5.1-0.6");
    }
    * html .ieshadow {
    position:absolute;
    z-index:-1;
    margin-left:-8px;
    margin-top:-8px;
    background:#000;
    filter:
    progid:DXImageTransform.Microsoft.Blur(pixelradius=3,makeshadow=true,shadowopacity=.6)
    progid:DXImageTransform.Microsoft.Blur(pixelradius=3)
    progid:DXImageTransform.Microsoft.Blur(pixelradius=3)
    ;
    }
    .mild {
    background-image:none !important;
    }
    /*.deviations .shadow :active,
    .aside-left .shadow :active,
    .dev-thumbnails .shadow :active,
    .dev-list .shadow :active {
    position:relative !important;
    top:1px !important;
    left:1px !important;
    }*/
    .shadow-holder .shadow {
    display:table-cell;
    }
    * html .shadow-holder, * html .shadow-holder .shadow {
    display:inline-block
    }
    /* --/Inline thumbnails------------------ */
     
    stuw, Jan 24, 2006 IP
  5. Dazed_and_confused

    Dazed_and_confused Well-Known Member

    Messages:
    2,071
    Likes Received:
    60
    Best Answers:
    0
    Trophy Points:
    120
    #5
    around :)
    any tutorial how to do it?
     
    Dazed_and_confused, Jan 24, 2006 IP
  6. T0PS3O

    T0PS3O Feel Good PLC

    Messages:
    13,219
    Likes Received:
    777
    Best Answers:
    0
    Trophy Points:
    0
    #6
    Of course!
     
    T0PS3O, Jan 24, 2006 IP
  7. Dazed_and_confused

    Dazed_and_confused Well-Known Member

    Messages:
    2,071
    Likes Received:
    60
    Best Answers:
    0
    Trophy Points:
    120
    #7
    heh, thanx :)
     
    Dazed_and_confused, Jan 24, 2006 IP