1

Вот так выглядит на IE10

А на IE8

Как видно по рисунку поменялся шрифт и его размер из за этого не влазит в меню, вопрос как уменьшит этот размер? а так же как потерялся текст в placeholdere?

  1. Как вариант пытался подключить отдельно стили для IE9 и ниже, но они не подключились o_O

    <link href="../css/colorpicker.css" rel="stylesheet" type="text/css" />
    <!--[if lte IE 9]><link rel="stylesheet" href="../css/style_ie.css"  type="text/css" /<![endif]-->
    
  2. с плейсхолдерем пытался поступить так

    <script type="text/javascript">
    
    $(document).ready(function() {
    /* Placeholder for IE */
    if($.browser.msie) { // Условие для вызова только в IE
        $("form").find("input[type='text']").each(function() {
            var tp = $(this).attr("placeholder");
            $(this).attr('value',tp).css('color','#ccc');
        }).focusin(function() {
            var val = $(this).attr('placeholder');
            if($(this).val() == val) {
                $(this).attr('value','').css('color','#303030');
            }
        }).focusout(function() {
            var val = $(this).attr('placeholder');
            if($(this).val() == "") {
                $(this).attr('value', val).css('color','#ccc');
            }
        });
    
        /* Protected send form */
        $("form").submit(function() {
            $(this).find("input[type='text']").each(function() {
                var val = $(this).attr('placeholder');
                if($(this).val() == val) {
                    $(this).attr('value','');
                }
            })
        });
    }
    });
    </script>
    

    но не получилось :(

2

2 ответа 2

1

Стили не подключились, потому что у вас была ошибка в разметке.
В условном комментарии вы не закрывали тэг link.
Исправьте код:

<!--[if lte IE 9]><link rel="stylesheet" href="../css/style_ie.css"  type="text/css" /><![endif]-->
2
  • блин внатуре) но вопрос стоял в том что на ie8 шрифт отображается не корректно @font-face { font-family: 'OswaldRegular'; src: url('-g5pdusrgvxvol5u-a_whw.eot'); src: url('-g5pdusrgvxvol5u-a_whw.eot') format('embedded-opentype'), url('-g5pdusrgvxvol5u-a_whw.woff') format('woff'), url('-g5pdusrgvxvol5u-a_whw.ttf') format('truetype'), url('-g5pdusrgvxvol5u-a_whw.svg#OswaldRegular') format('svg'); }
    – reddyk
    16 мая 2014 в 9:47
  • @reddyk, соберите пример на jsFiddle, будет проще ответить
    – VenZell
    16 мая 2014 в 10:30
1

Касательно placeholder. Ваш код работает только для элементов типа input, поскольку использует соответствующий селектор и .attr('value') вместо .val(). Кроме того, $.browser — это устаревшее свойство. Исправленный код:

if(!('placeholder' in document.createElement('input'))){
$(document).ready(function() {
$("form").find("input[type='text'], textarea").each(function() {
        var tp = $(this).attr("placeholder");
        $(this).val(tp).css('color','#ccc');
    }).focusin(function() {
        var val = $(this).attr('placeholder');
        if($(this).val() == val) {
            $(this).val('').css('color','#303030');
        }
    }).focusout(function() {
        var val = $(this).attr('placeholder');
        if($(this).val() == "") {
            $(this).val(val).css('color','#ccc');
        }
    });
    $("form").submit(function() {
        $(this).find("input[type='text'], textarea").each(function() {
            var val = $(this).attr('placeholder');
            if($(this).val() == val) {
                $(this).val('');
            }
        })
    });
});
}
1
  • да я примерно такое же решение принял)
    – reddyk
    16 мая 2014 в 11:54

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.