0 Пользователей и 1 Гость просматривают эту тему.
  • 92 Ответов
  • 71557 Просмотров
*

plotnick

  • Осваиваюсь на форуме
  • 31
  • 0 / 0
Вот, сделал логотип для сайта в виде прозрачного *.png - Opera, Firefox, IE7 понимают что куда, шестой же "осел" показывает пикчюру с фоном - эту проблему как то можно решить?
*

Timon_Crazy

  • Захожу иногда
  • 364
  • 31 / 4
  • Лицензнаци
можно
есть модули - боты.

например вот этот.

[вложение удалено Администратором]
ЧаВо - FAQ - Вопросы
--
Сщастливый безумец -- не говори спасибо: + поставь не ставь минус - поругай.
*

plotnick

  • Осваиваюсь на форуме
  • 31
  • 0 / 0
Хотелось бы средствами html или css это сделать...
Тут оказывется про это уже было http://joomlaforum.ru/index.php?topic=3251.0 - не углядел.
*

Timon_Crazy

  • Захожу иногда
  • 364
  • 31 / 4
  • Лицензнаци
как это можно сделать, если сам IE не показывает прозрачные png
ЧаВо - FAQ - Вопросы
--
Сщастливый безумец -- не говори спасибо: + поставь не ставь минус - поругай.
*

maverick_den

  • Захожу иногда
  • 68
  • 10 / 4
как это можно сделать, если сам IE не показывает прозрачные png
Например вот так:
.prompt{
   background:none;
   filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=../img/prompt.png);
}
Этот фильтр в ие даст нормальную прозрачность для PNG. Однако есть еще одна трабла - ие зачем-то делает PNG картинки темнее, чем они есть на самом деле. Зачем он это делает - как всегда вопрос. И как с этим бороться я тоже не знаю, хотя знающие люди говорят, что что-то сделать все-таки можно.
*

plotnick

  • Осваиваюсь на форуме
  • 31
  • 0 / 0
Например вот так:
.prompt{
   background:none;
   filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=../img/prompt.png);
}
Этот фильтр в ие даст нормальную прозрачность для PNG. Однако есть еще одна трабла - ие зачем-то делает PNG картинки темнее, чем они есть на самом деле. Зачем он это делает - как всегда вопрос. И как с этим бороться я тоже не знаю, хотя знающие люди говорят, что что-то сделать все-таки можно.

Насчет темноты цитата с http://www.tigir.com/alpha_png.htm

"Почему PNG темнее в IE?

В IE есть ещё одна особенность связанная с отображением PNG (PNG24), проявляющаяся в более темном отображении изображения. Причиной этому служит записанная в файл изображения дополнительная информация о гамме (chunk gAMA) (например, Photoshop добавляет эту информацию). Для решения проблемы нужно "почистить" PNG-файл от излишней информации. Сделать это просто с помощью утилиты pngout (использовать так: pngout.exe in.png out.png)."
*

maverick_den

  • Захожу иногда
  • 68
  • 10 / 4
Сделать это просто с помощью утилиты pngout (использовать так: pngout.exe in.png out.png)."
Точно !!! Спасибо за инфу, пригодится:)
*

Connector

  • Новичок
  • 20
  • 5 / 0
Еще есть функция на пхп помогающая решить это св-ми нтмл
Код
function replacePngTags($x,$img_path='',$sizeMeth='scale',$inScript=FALSE){
    $arr2=array();
    // make sure that we are only replacing for the Windows versions of Internet
    // Explorer 5.5+
    $msie='/msie\s(5\.[5-9]|[6]\.[0-9]*).*(win)/i';
    if( !isset($_SERVER['HTTP_USER_AGENT']) ||
        !preg_match($msie,$_SERVER['HTTP_USER_AGENT']) ||
        preg_match('/opera/i',$_SERVER['HTTP_USER_AGENT']))
        return $x;
 
    if($inScript){
        // first, I want to remove all scripts from the page...
        $saved_scripts=array();
        $placeholders=array();
        preg_match_all('`<script[^>]*>(.*)</script>`isU',$x,$scripts);
        for($i=0;$i<count($scripts[0]);$i++){
            $x=str_replace($scripts[0][$i],'replacePngTags_ScriptTag-'.$i,$x);
            $saved_scripts[]=$scripts[0][$i];
            $placeholders[]='replacePngTags_ScriptTag-'.$i;
        }
    }
 
    // find all the png images in backgrounds
    preg_match_all('/background-image:\s*url\(([\\"\\\']?)([^\)]+\.png)\1\);/Uis',$x,$background);
    for($i=0;$i<count($background[0]);$i++){
        // simply replace:
        //  "background-image: url('image.png');"
        // with:
        //  "filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(
        //      enabled=true, sizingMethod=scale, src='image.png');"
        // I don't think that the background-repeat styles will work with this...
        $x=str_replace($background[0][$i],'filter:progid:DXImageTransform.'.
                'Microsoft.AlphaImageLoader(enabled=true, sizingMethod='.$sizeMeth.
                ', src=\''.$background[2][$i].'\');',$x);
    }
 
    // find all the IMG tags with ".png" in them
    $pattern='/<(input|img)[^>]*src=([\\"\\\']?)([^>]*\.png)\2[^>]*>/i';
    preg_match_all($pattern,$x,$images);
    for($num_images=0;$num_images<count($images[0]);$num_images++){
        // for each found image pattern
        $original=$images[0][$num_images];
        $quote=$images[2][$num_images];
        $atts=''; $width=0; $height=0; $modified=$original;
 
        // We do this so that we can put our spacer.png image in the same
        // directory as the image - if a path wasn't passed to the function
        if(empty($img_path)){
            $tmp=split('[\\/]',$images[3][$num_images]);
            $this_img=array_pop($tmp);
            $img_path=join('/',$tmp);
            if(empty($img_path)){
                // this was a relative URI, image should be in this directory
                $tmp=split('[\\/]',$_SERVER['SCRIPT_NAME']);
                array_pop($tmp);    // trash the script name, we only want the directory name
                $img_path=join('/',$tmp).'/';
            }else{
                $img_path.='/';
            }
        }else if(substr($img_path,-1)!='/'){
            // in case the supplied path didn't end with a /
            $img_path.='/';
        }
 
        // If the size is defined by styles, find them
        preg_match_all(
            '/style=([\\"\\\']).*(\s?width:\s?([0-9]+(px|%));).*'.
            '(\s?height:\s?([0-9]+(px|%));).*\\1/Ui',
               $images[0][$num_images],$arr2);
        if(is_array($arr2) && count($arr2[0])){
            // size was defined by styles, get values
            $width=$arr2[3][0];
            $height=$arr2[6][0];
 
            // remove the width and height from the style
            $stripper=str_replace(' ','\s','/('.$arr2[2][0].'|'.$arr2[5][0].')/');
            // Also remove any empty style tags
            $modified=preg_replace(
                '`style='.$arr2[1][0].$arr2[1][0].'`i',
                '',
                preg_replace($stripper,'',$modified));
        }else{
            // size was not defined by styles, get values from attributes
            preg_match_all('/width=([\\"\\\']?)([0-9%]+)\\1/i',$images[0][$num_images],$arr2);
            if(is_array($arr2) && count($arr2[0])){
                $width=$arr2[2][0];
                if(is_numeric($width))
                    $width.='px';
   
                // remove width from the tag
                $modified=str_replace($arr2[0][0],'',$modified);
            }
            preg_match_all('/height=([\\"\\\']?)([0-9%]+)\\1/i',$images[0][$num_images],$arr2);
            if(is_array($arr2) && count($arr2[0])){
                $height=$arr2[2][0];
                if(is_numeric($height))
                    $height.='px';
   
                // remove height from the tag
                $modified=str_replace($arr2[0][0],'',$modified);
            }
        }
 
        if($width==0 || $height==0){
            // width and height not defined in HTML attributes or css style, try to get
            // them from the image itself
            // this does not work in all conditions... It is best to define width and
            // height in your img tag or with inline styles..
            if(file_exists($_SERVER['DOCUMENT_ROOT'].$img_path.$images[3][$num_images])){
                // image is on this filesystem, get width & height
                $size=getimagesize($_SERVER['DOCUMENT_ROOT'].$img_path.$images[3][$num_images]);
                $width=$size[0].'px';
                $height=$size[1].'px';
            }else if(file_exists($_SERVER['DOCUMENT_ROOT'].$images[3][$num_images])){
                // image is on this filesystem, get width & height
                $size=getimagesize($_SERVER['DOCUMENT_ROOT'].$images[3][$num_images]);
                $width=$size[0].'px';
                $height=$size[1].'px';
            }
        }
       
        // end quote is already supplied by originial src attribute
        $replace_src_with=$quote.$img_path.'spacer.png'.$quote.' style="width: '.$width.
            '; height: '.$height.'; filter: progid:DXImageTransform.'.
            'Microsoft.AlphaImageLoader(src=\''.$images[3][$num_images].'\', sizingMethod='.
            $sizeMeth.');"';
 
        // now create the new tag from the old
        $new_tag=str_replace($quote.$images[3][$num_images].$quote,$replace_src_with,
            str_replace('  ',' ',$modified));
        // now place the new tag into the content
        $x=str_replace($original,$new_tag,$x);
    }
   
    if($inScript){
        // before the return, put the script tags back in. (I was having problems when there was
        // javascript that had image tags for PNGs in it when using this function...
        $x=str_replace($placeholders,$saved_scripts,$x);
    }
   
    return $x;
}
*

maverick_den

  • Захожу иногда
  • 68
  • 10 / 4
Еще есть функция на пхп помогающая решить это св-ми нтмл
Гемор это. В ЦСС проще все делать
*

Connector

  • Новичок
  • 20
  • 5 / 0
Только ИЕ filter: воспринисмает ?
*

userxp

  • Живу я здесь
  • 2019
  • 403 / 6
  • Злой и ужасный бармалей
фильтр только ишак и понимает
чисто мелкософтовская заморочка
Как правильно задавать вопрос службе технической поддержки  yes!
SGA CM 7.2.0 RC0 KANG Build GWK74 + s95allinonescript + CWM 5.0.2.6 + Modem XWKT3
*

canislc

  • Осваиваюсь на форуме
  • 34
  • 11 / 0
А как на Joomla.com решена проблема с прозрачностью? В правом верхнем углу "Support Joomla" прописан через css:
в шаблоне - <a id="corner" style="" href="http://www.joomla.org/content/view/689/79/">Support Joomla!</a>
в css:

a#corner {template_css.css (line 610)
background:transparent url(../images/joomla_donate.png) no-repeat scroll right top !important;
display:block;
height:90px;
position:absolute;
right:0pt;
text-decoration:none;
text-indent:-999em;
top:0pt;
width:100px;

Попытался сделать то же самое - не работает в IE6.
*

poizon

  • Захожу иногда
  • 495
  • 187 / 1
  • Buu
<a id="corner" href="http://www.joomla.org/content/view/689/79/" style="filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://www.joomla.org/templates/jw_joomla/images/joomla_donate.png',sizingMethod='scale');">Support Joomla!</a>

ой блин, незнаю чем вас нравятся эти способы через CSS Или фильтры... меня устраивает обычный яваскриптик и условие в шаблоне.

http://homepage.ntlworld.com/bobosola/pngtestfixed.htm - юзаю это решение и доволен им.
*

canislc

  • Осваиваюсь на форуме
  • 34
  • 11 / 0
C css не помогла. Попробовал через яву - что-то не совсем получилось, или я что-то не так делаю... fesor поподробнее опиши-ка.
*

poizon

  • Захожу иногда
  • 495
  • 187 / 1
  • Buu
берем приложенный файл (переименовав в js)
Вставляем в
<head>

Вот такое, указаав нужный путь

<!-- Исправляем глюк png в осле -->
<!--[if gte IE 5.5000]>
<!--[if lte IE 7]><script language="JavaScript" type="text/javascript"  src="/templates/шаблон/js/correctpng.js"></script><![endif]-->

</head>

если сделать без ошибок, то все работает... проверено лично...  ;)

[вложение удалено Администратором]

у меня неполучилось с начала сделать через проверку HTML_ую, я через хттп сделал определение и в шаблонах просто при интернет эксплоире подключается pngfix.js и cssfix если надо))
*

poizon

  • Захожу иногда
  • 495
  • 187 / 1
  • Buu
ух как сложно =)
*

canislc

  • Осваиваюсь на форуме
  • 34
  • 11 / 0
Что-то не работает:
в код шаблона вставил
<head>
<!--[if gte IE 5.5000]>
<!--[if lte IE 7]>
<script language="JavaScript" type="text/javascript" src="/templates/default/js/correctpng.js"></script>
<![endif]-->

В папке с шаблоном default создал папку js (на всякий случай кинул не в корень), закинул туда сorrectpng.js - никакого эффекта. Только валидатор выдает ошибку в трее:

window.attachEvent is not a function
window.attachEvent("onload", correctPNG);

что-то ты намудрил, как-то у тя неправильно проверка проставлена))
*

canislc

  • Осваиваюсь на форуме
  • 34
  • 11 / 0
Ну, как написал poizon, так и поставил, только без коммента.
*

maverick_den

  • Захожу иногда
  • 68
  • 10 / 4
Надо с комментом. Вам уже готовый код дают, и то умудряетесь испортить :)
*

poizon

  • Захожу иногда
  • 495
  • 187 / 1
  • Buu
Про валидатор - забудь.
Никогда не возможно сделать все абсолюно валидно (кроме самого шаблона, но сам сайт 100% будет "с ошибками").
Тем более тот кусок понимает ТОЛЬКО осел, так что ничего страшного.

ну у меня все валидно xhtml1.0 и css3....  ошибок в JS нету, все работает прекрасно во всех браузерах только вот PNG d ШУ темнее чем надо, и фон сайта пришлось тоже исправлять)
*

poizon

  • Захожу иногда
  • 495
  • 187 / 1
  • Buu
ПНГ темнее из-за того, что ты сделал его через фотошоп, который вписывает в него довольно много лишней информации, попробуй скачать pngcleaner и вычестить им пнг...

о, спасибо)))

http://www.fnordware.com/superpng/ - каму надо: оч хороший плугин для сохранения PNG)
« Последнее редактирование: 08.10.2007, 22:30:12 от fesor »
*

poizon

  • Захожу иногда
  • 495
  • 187 / 1
  • Buu
всегда пожалуйста =)
*

canislc

  • Осваиваюсь на форуме
  • 34
  • 11 / 0
Цитировать
Надо с комментом. Вам уже готовый код дают, и то умудряетесь испортить

Ага, так вот как ИЕ понимает, что это для него: читает коммент, доходит до слова "осле" и думает: "О, это же я!" :)

P.S. Как можно было догадываться, с комментом тоже не работает.... ерунда какая-то.
« Последнее редактирование: 09.10.2007, 13:42:35 от canislc »

убери комменты и сделай проверку на уровне http)) пример ищи на форуме))
*

poizon

  • Захожу иногда
  • 495
  • 187 / 1
  • Buu
попробуй путь к файлику задать так:

<!-- Исправляем глюк png в осле -->
<!--[if gte IE 5.5000]>
<!--[if lte IE 7]><script language="JavaScript" type="text/javascript"  src="<?php echo $mosConfig_live_site; ?>/templates/шаблон/js/correctpng.js"></script><![endif]-->

бывает, что без этого файл не видит...
Чтобы оставить сообщение,
Вам необходимо Войти или Зарегистрироваться