Do you have any png fix on the logo?

Forums    Joomla Templates Club    JA Opal    Do you have any png fix on the logo?
Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • chacapamac Friend
    April 5, 2009 at 4:58 pm #139949

    I was wondering if you have any png fix on the logo because I was able to make a perfect transparent png for explorer 6 wit the logo image?

    nguyenhuu quang Friend
    April 5, 2009 at 5:34 pm #300159

    pls send your live site?

    hanifahmed Friend
    April 5, 2009 at 7:36 pm #300186

    Hi mate,

    I think this is the one I used for one of my sites:

    <!–>
    <script defer type=”text/javascript” src=”pngfix.js”></script>
    <!–>You need to put it in the HTML under Template Manager, under <head> under all the other “if lt IE.. blah blah”

    And you need to put the corresponding Javascript file in the root folder. See attached!

    Let me know how it goes!

    1. pngfix.zip
    chacapamac Friend
    April 6, 2009 at 12:15 am #300199

    The png fix on Opal are targeting only the images that need to be fix in explorer 6…

    I like that because many Ultimate at large png fixes are some time more headaches than helpfull…

    Still searching for a final one that will ready do the job………… :confused:

    In Opal the png fixes seem to be in the ie.php (contains css for only ie 6) :

    EXAMPLE:

    h1.logo a {
    filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='<?php echo $template_path;?>/images/logo.png', sizingMethod='image');
    background-image: url(images/blank.gif);
    }

    p.stickynote {
    filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='<?php echo $template_path;?>/images/icon-sticky.png', sizingMethod='crop');
    background-image: url(images/blank.gif);
    width: 89%;
    }

    p.download {.....

    and more…..

    The code for the logo work with another css find in the template.css

    h1.logo a {
    width: 352px;
    height: 204px;
    display: block;
    background: url(../images/logo.png) no-repeat center;
    }

    Work perfectly! 🙂

    However I have a question…?

    I try the same type of code with a repeating png ( I know this is harder) on a slide that I use to replace the JA-Slide.

    see it at : http://www.grafcomm.ca/joomlagraf/opal/

    I Use:

    .gk_ni_6_hover {
    background: url(/images/header_tab_hover_bg.png);
    filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='<?php echo $template_path;?>/images/header_tab_hover_bg.png', sizingMethod='scale');
    background-image: none;
    }

    with the code:

    .gk_ni_6_hover{
    display: block;
    width: 9px;
    height:68px;
    background: transparent url(../images/header_tab_hover_bg.png) repeat;
    }

    It almost work……..
    In explorer 6, when you rollover the thumbnails of the slide you can see the reddish rollover appear for a fraction of second and, sadly diseappear afterwards….

    I know I’m close, but some help from a Joomlart Guru will be appreciated…..

    You can see what the roolover is on other browser…

    beta777 Friend
    April 8, 2009 at 9:37 am #300521

    <em>@hanifahmed 122890 wrote:</em><blockquote>Hi mate,

    And you need to put the corresponding Javascript file in the foot folder. See attached!

    </blockquote>

    Hi,
    cannot find foot folder :confused:
    Have I create it? where?

    TIA

    hanifahmed Friend
    April 8, 2009 at 9:38 am #300522

    <em>@beta777 123345 wrote:</em><blockquote>Hi,
    cannot find foot folder :confused:
    Have I create it? where?

    TIA</blockquote>
    Sorry mate I meant ROOT not foot!

    The root folder is the main folder of your installation.

    chacapamac Friend
    April 8, 2009 at 1:06 pm #300537

    This is what I try so far:
    I try to copy the png fix use on opal to have transparent png on a rollover for a replacement of the JA-Slide

    see it at : http://www.grafcomm.ca/joomlagraf/opal/

    See attach image for how it’s supposed to look… (Rollover.jpg)

    The png fix example of opal is:

    in ie.php (target ie6)

    h1.logo a {
    filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='<?php echo $template_path;?>/images/logo.png', sizingMethod='image');
    background-image: url(images/blank.gif);
    }

    in conjunction with another css find in the template.css

    h1.logo a {
    width: 352px;
    height: 204px;
    display: block;
    background: url(../images/logo.png) no-repeat center;
    }

    I try: (Use sizingMethod=’scale’ because it’s a repeat background)

    TEST ONE:

    .gk_ni_6_hover {
    background: url(/images/header_tab_hover_bg.png);
    filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='<?php echo $template_path;?>/images/header_tab_hover_bg.png', sizingMethod='scale');
    background-image: none;
    }

    WITH

    .gk_ni_6_hover{
    display: block;
    width: 9px;
    height:68px;
    background: transparent url(../images/header_tab_hover_bg.png) repeat;
    }

    and TEST TWO:

    .gk_ni_6_hover {
    background: url(/images/header_tab_hover_bg.png);
    filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='<?php echo $template_path;?>/images/header_tab_hover_bg.png', sizingMethod='scale');
    background-image: url(images/blank.gif);
    }

    Here I change for the background-image: url(images/blank.gif); that target a 1×1 pixel transparent gif

    WITH:

    .gk_ni_6_hover{
    display: block;
    width: 9px;
    height:68px;
    background: url(../../../templates/ja_opal/images/header_tab_hover_bg.png) repeat;
    }

    Here I take out the transparent before the url

    Both result in explorer 6 make a rapid apparition the first time you rollover of the redish effect, but diseappear completly after….

    If no solutions are suggested, I will probably try to have a complete image for the rollover (no repeat) and tell you how it goes….

    1. Rollover
  • Author
    Posts
Viewing 7 posts - 1 through 7 (of 7 total)

This topic contains 7 replies, has 4 voices, and was last updated by  chacapamac 15 years, 7 months ago.

We moved to new unified forum. Please post all new support queries in our New Forum

Important Notice :

New Unified Portal is live

Must Read

Jump to forum

Categories