SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Zealot stikkybubble's Avatar
    Join Date
    Sep 2006
    Location
    Pluto
    Posts
    182
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    gradient not working in Opera 11

    Hi,
    just tidying some things up and adding snazzy css3 stuff for browsers other than safari, chrome and firefox when I noticed that the opera gradients don't seem to be working.

    Because this is fairly new (only opera 11) a search on google finds no help at all. Just basic instructions but nobody else who hasn't been able to get it working.

    The colours are echoed by a php script. I'm a bit worried that they are in the wrong format for Opera but it doesn't say anything on the Opera dev page I looked at about it not working unless you use a certain notation.

    If I have to dig about in the php script now and change things I will probably cause all sorts of other things to break.

    Here's the line of css that's not working:

    background-image: -o-linear-gradient(top, #<?php echo $colour1;?>,#<?php echo $colour2;?>);

    Anything wrong with that? Am I missing something somewhere?

    I'm going to have a look at the php in a minute and will post back with the colour format - it's a very long time since I wrote the script (which generates random colours). I need to alter it at some point anyway, because strangely reds and greens are the colours it produces most often. It could be a flaw in the code but I think it's actually something to do with colour/perception! Anyway ... I didn't want to be forced to redo it by something like this but maybe that will be the only solution!

    Any ideas?

    EDIT: as I thought, the php is just a random hex string. It works in every other browser at the moment, just not Opera. The example on Opera dev. shows this format though rgb(000,000,000) is this significant?

    I will try substituting colour names and see if it works, but if that doesn't work I have a problem. IE needs the full-length hex code afaik.

    LATER: tried that, didn't work. Tried rgb, didn't work. Tried copying and pasteing the code from the Opera dev page and THAT didn't work. I have taken the declaration for background-colour out in case that was over-riding it somehow, and it makes no difference at all.

    Here's the opera dev page http://dev.opera.com/articles/view/c...ear-gradients/

    The php script is working fine, the colours it returns appear in every other place they are used with no problem at all. I did think perhaps some quirk meant opera was only getting one colour, but that's not the case. There must be either something wrong with this css syntax, or Opera 11.01 doesn't really support gradients, or there's some weird bug that I need to be aware of (like the ones where you need to set "zoom" for something to work in IE, or only working on certain elements).

    GRR.

  2. #2
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    39,797
    Mentioned
    158 Post(s)
    Tagged
    3 Thread(s)
    Are you using opera 11.10 beta as I believe that's the only one that supports gradients?

    This works for me with no problem.

    Code:
        background: -o-linear-gradient(top,  rgb(48,48,48) 25%,  rgb(135,135,135) 100%  );

  3. #3
    SitePoint Zealot stikkybubble's Avatar
    Join Date
    Sep 2006
    Location
    Pluto
    Posts
    182
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    ah I see. I just downloaded the latest opera (11.01) but not a beta. I won't worry about it then! I'll just stick the code in and people will see it eventually.

    I copied and pasted your code just to be sure and it didn't work.

    I might download the beta but at the moment I think it would be wiser to move on and worry about the rest of the design! Thanks for the help!


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •