Некоторые селекторы sIFR не работают в Safari - крайне необычная ошибка:

Я создаю сайт CardinalCoffee.com, используя sIFR.

Он не совсем готов к работе, поэтому получите доступ, добавив

72.249.85.228   cardinalcoffee.com
72.249.85.228   www.cardinalcoffee.com

в ваш / etc / hosts (C: \ WINDOWS \ system32 \ drivers \ etc \ hosts в Windows).

На странице блога (http://cardinalcoffee.com/blog/) и только на странице блога. , некоторые селекторы sIFR не работают - но только в Safari. Навигация на основе sIFR и подзаголовки сообщений блога не отображаются на странице блога, но они есть везде (и во всех других браузерах страница / blog / подойдет).

Вот подходящие селекторы из sifr-config.js:

sIFR.replace(itc_anna_std, {
  selector: '#top_nav li a',
    css: [
        '.sIFR-root {.sIFR-root { background-color: #f8eca8; color: #FFBF11; }',
        'a { text-decoration: none; color: #FFBF11;}',
        'a:link { color: #FFBF11; color: #FFBF11;}',
        'a:hover { color: #FFBF11; color: #FFBF11;}'
    ],
    wmode: 'transparent',
    forceSingleLine: true,
    tuneWidth: 2
});
sIFR.replace(itc_anna_std, {
  selector: '.non-admin #content_column .entry h2 a',
  css: [
        '.sIFR-root { background-color: #f8eca8; color: #170504; text-align:left;}',
        'a {text-decoration:none; color: #170504;}',
        'a:hover { color: #170504; }'       
    ],
    wmode: 'transparent',
    tuneHeight: -18,
    offsetTop: -6
});

Кроме того, кажется, что игнорируется объявление размера шрифта в подзаголовках (селектор: .entry h2 a). Вот подходящее правило стиля из sifr.css:

    .sIFR-active .non_admin #content_column .entry h2 {
        font-size: 36px;
    visibility: hidden;
    }

Это сайт WordPress.

[править]: Похоже, что это правило как-то виновато:

sIFR.replace(itc_anna_std, {
  selector: '.non-admin #content-column .entry h2',
  css: [
        '.sIFR-root { background-color: #f8eca8; color: #170504;}',
        'a { text-decoration: none; color: #170504;}',
        'a:link { text-decoration: none; color: #170504;}',
        'a:hover { color: #170504;}'
    ],
    wmode: 'transparent',
    tuneHeight: -18,
    offsetTop: -6
});

(Я переместил другую замену sIFR в начало файла, и навигация начала загружаться безупречно.)


javascript css safari xhtml sifr
person Community    schedule 07.06.2009    source источник
comment
Я ценю ваш проницательный комментарий! Но навигация должна создаваться динамически, и управление ImageMagick + Wordpress, затрудненное необходимостью прозрачности изображения на сложном фоне, просто абсурдно по сложности по сравнению с хотя и неприятной ошибкой sIFR. Надеюсь, мое решение будет полезно для других разработчиков, использующих sIFR.   -  person    schedule 09.06.2009

Ответы (1)


arrow_upward
0
arrow_downward

Хорошо, похоже, что для ‹a› внутри каждого ‹h2› был назначен класс, потому что я включал функцию редактирования на месте с Flutter.

Когда я удалил класс на ‹a›, замены прошли нормально.

По-прежнему не объясняет, почему перемещение замены заголовка div.SimpleSideNav ul.sf li sIFR в верхнюю часть конфигураций sifr-config.js заставило его работать, но я не собираюсь смотреть в подарок лошадь во рту.

person Community    schedule 08.06.2009
comment
Не уверен, но похоже, что вы в этом разобрались :) Возможно, были проблемы со спецификой селектора. sIFR требует, чтобы вы в первую очередь ставили наиболее конкретные замены. Кстати, вы не можете заменять ссылки напрямую, они не будут работать должным образом в разных браузерах. Вам нужно заменить их родительский элемент, чтобы ссылка попала внутрь Flash-ролика. - person Mark Wubben; 11.06.2009