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.

Image background upside down

Discussion in 'CSS' started by Cypherus, Apr 25, 2007.

0
  1. #1
    Hi there,

    Like the topic says, is it possible to flip and image upside-down with CSS?
     
    Cypherus, Apr 25, 2007 IP
  2. Cypherus

    Cypherus Peon

    Messages:
    1,551
    Likes Received:
    102
    Best Answers:
    0
    Trophy Points:
    0
    #2
    Why isn't there and edit button here anymore?

    I meant the background image, not just an normal image.
     
    Cypherus, Apr 25, 2007 IP
  3. Clive

    Clive Web Developer

    Messages:
    4,507
    Likes Received:
    297
    Best Answers:
    0
    Trophy Points:
    250
    #3
    The Edit button goes away after a given time in which you are allowed to make changes to your post.

    As for the issue, why not just edit the image apply a vertical flip to it, it will take only seconds to do this via Photoshop, for instance..
     
    Clive, Apr 26, 2007 IP
  4. diarmuid

    diarmuid Peon

    Messages:
    285
    Likes Received:
    13
    Best Answers:
    0
    Trophy Points:
    0
    #4
    It'd probably just be easiest to flip the image using an image program such as photoshop or gimp (if you haven't used it its a great free program).

    It should only take a moment, but having just checked trhough my CSS reference book, I don't think there is a way to flip anything with CSS...

    If you do find a way to flip in CSS, it'd be great to see how you did it, because that might be useful!

    Diarmuid
     
    diarmuid, Apr 26, 2007 IP
  5. lighe

    lighe Active Member

    Messages:
    150
    Likes Received:
    2
    Best Answers:
    0
    Trophy Points:
    53
    #5
    nope, it's not possible. actually you can't modify too many properties of a given background. only repeat and position. not even size.
    it's very likely to be possible to flip the image using PHP but i'm not very sure.
     
    lighe, Apr 28, 2007 IP
  6. Cypherus

    Cypherus Peon

    Messages:
    1,551
    Likes Received:
    102
    Best Answers:
    0
    Trophy Points:
    0
    #6
    I've found out that it's possible for IE, but not for any gecko browsers..

    Too bad, but photoshop came to my rescue!
     
    Cypherus, Apr 29, 2007 IP
  7. AndrewR

    AndrewR Peon

    Messages:
    108
    Likes Received:
    2
    Best Answers:
    0
    Trophy Points:
    0
    #7
    What you COULD do, if it is that important to do it "on the fly", you can use a PHP script to find the image, copy it to another destination on your server, flip it, then have the script echo out the new filename such as this:

    <div style="background: url(path/to/image.gif);"></div>
     
    AndrewR, Apr 29, 2007 IP
  8. Mr Blonde

    Mr Blonde Guest

    Messages:
    142
    Likes Received:
    6
    Best Answers:
    0
    Trophy Points:
    0
    #8
    yeah AndrewR's right, look up gd library for php
     
    Mr Blonde, Apr 29, 2007 IP
  9. Cypherus

    Cypherus Peon

    Messages:
    1,551
    Likes Received:
    102
    Best Answers:
    0
    Trophy Points:
    0
    #9
    Flipping the images "on the fly" everytime the site loads? No one who knows the word optimize would ever do that :b
     
    Cypherus, Apr 30, 2007 IP
  10. Mr Blonde

    Mr Blonde Guest

    Messages:
    142
    Likes Received:
    6
    Best Answers:
    0
    Trophy Points:
    0
    #10
    it would only do it once and then reference the 'upside down' image it created from then on
     
    Mr Blonde, Apr 30, 2007 IP
  11. AndrewR

    AndrewR Peon

    Messages:
    108
    Likes Received:
    2
    Best Answers:
    0
    Trophy Points:
    0
    #11
    I didn't mean it like that, but if he needed it only on certain times, or when the image isn't static, but includes things like people uploading their own photos to the site, which needed to be flipped, etc. There are many instances where it could have been necessary.
     
    AndrewR, Apr 30, 2007 IP
  12. Clive

    Clive Web Developer

    Messages:
    4,507
    Likes Received:
    297
    Best Answers:
    0
    Trophy Points:
    250
    #12
    Many instances? Can you describe one of them?
     
    Clive, May 2, 2007 IP
  13. Mr Blonde

    Mr Blonde Guest

    Messages:
    142
    Likes Received:
    6
    Best Answers:
    0
    Trophy Points:
    0
    #13
    an auction site where a user uploads an image that needs to be resized...
     
    Mr Blonde, May 2, 2007 IP
  14. Clive

    Clive Web Developer

    Messages:
    4,507
    Likes Received:
    297
    Best Answers:
    0
    Trophy Points:
    250
    #14
    Sorry for the confusion,
    I was actually referring to the "flipping and image upside-down with CSS" usability which I am not sure of, not the image resizing.
     
    Clive, May 3, 2007 IP
  15. Mr Blonde

    Mr Blonde Guest

    Messages:
    142
    Likes Received:
    6
    Best Answers:
    0
    Trophy Points:
    0
    #15
    haha yeah me either actually... unless you tell the user just to upload the image upside-down so you can flip it back? :rolleyes:
     
    Mr Blonde, May 3, 2007 IP
  16. AndrewR

    AndrewR Peon

    Messages:
    108
    Likes Received:
    2
    Best Answers:
    0
    Trophy Points:
    0
    #16
    Sorry to revive this thread, but one of the instances I was referring to is if a user uploads a photo taken from a camera, and if they took it landscape-oriented, then you could have made a script which flips it 90-270 degrees depending on user preference, etc.
     
    AndrewR, May 17, 2007 IP