WordPress.org

Ready to get started?Download WordPress

Forums

Spun
[closed] Inconsistent 'Spun' with Opera, Safari, IE. Revised. (2 posts)

  1. kirkfree
    Member
    Posted 1 year ago #

    robinson.ky.
    The intention is that the link images are sepia-toned but go to colour when hovered.
    This now works apparently perfectly for Windows in Chrome and Firefox, but not in:
    IE - can't get sepia working, just grayscale (and squares in IE8).
    Safari and Opera - no fading at all, images remain full-colour.

    On Mac OSX and apparently IOS, Android
    it works fine in Chrome, Safari and Firefox.
    images remain in full colour on Opera

    Can't help feeling I've got the precedence wrong in the spun-child styles.css. Here's the relevant bit of style.css

    /* WIP my version */
    .blog .hentry a .attachment-post-thumbnail {
    filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'old-timey\'><feColorMatrix type=\'matrix\' values=\'0.35 0.35 0.35 0 0 0.25 0.25 0.25 0 0 0.15 0.15 0.15 0 0 0 0 0 1 0\'/></filter></svg>#old-timey");
        -webkit-filter: sepia(1);
        -webkit-filter: sepia(100%);
        -moz-filter: sepia(100%);
        -ms-filter: sepia(100%);
        -o-filter: sepia(100%);
        filter: sepia(100%);
    }
    
    .blog .hentry a .attachment-post-thumbnail hover{
      -webkit-filter: none;
      -moz-filter: none;
      -ms-filter: none;
      -o-filter: none;
      filter: none;
      filter: alpha(opacity = 100);
    }
  2. Andrew
    Forum Moderator
    Posted 1 year ago #

Topic Closed

This topic has been closed to new replies.

About this Theme

About this Topic