Мой сайт продолжает рушиться на моем Chrome

Ответ 1

Проблема, похоже, является частью css в iframe /page/story. Когда вы меняете единицы измерения в -webkit-column-gap от vw до px (или полностью удаляете), он полностью испортил макет iframe, но он больше не разбивает вкладку браузера.

Я думаю, что это ошибка в движке рендеринга Chrome, который разбивается с новым модулем vw в свойстве column-gap css.

Если вам нужен простой двухклассный макет, я предлагаю использовать два div с

<div style="width: 50%; float: left;"></div>

ИЗМЕНИТЬ

Одним из возможных способов является изменение значения css с помощью javascript с использованием значений пикселей.

function onResize() {
    var width = 0.45 * $(window).width();
    var gap = 0.05 * $(window).width();
    $("#content")
        .css("-webkit-column-width", width + "px")
        .css("-webkit-column-gap", gap + "px");
}

$(function() {
    if (/webkit/.test(navigator.userAgent.toLowerCase())) {
        $(window).resize(onResize);
        onResize();
    }
});

2nd Edit

Чтобы получить ширину div, содержащего столбцы, вы можете вставить

<span id="endmarker"></span>

а затем получить левую позицию с $("#endmarker").position().left + columnWidth, которая является общей шириной всех столбцов. Существует один особый случай, когда контент соответствует точно (без пиксельного пространства выше или ниже текста) в два столбца, по какой-либо причине диапазон, по-видимому, перемещается в первый столбец.

3rd Edit

Я обнаружил решение проблемы во втором редактировании, если вы добавили пробел в диапазон маркера (<span id="endmarker">&nbsp;</span>), проблема, похоже, исчезла.

Ответ 2

Похоже, это может быть связано с вашим событием hashchange. Там сообщение в StackOverflow, где кто-то еще не мог его использовать, может быть полезно прочитать: $(window).hashchange() не работает

Я предлагаю комментировать

$(function() {
    $(window).trigger('hashchange');
});

и проверьте, правильно ли загружена страница, а затем оттуда.

Что касается совместимости с браузером, я считаю этот сайт полезным: http://caniuse.com/#search=hash

Ответ 3

В файле Story.html, который загружается iframe, у вас есть некоторые определения стиля в теле, переместите его в раздел главы:) (что не проблема, это просто выглядит плохо)

Также в этом же определении стиля у вас есть

body.visitor_mode div # content

Измените его на

body.visitor_mode div.content

(который вы используете в коде btw: P)

И это решило проблему на моей Chrome (версия 30.0.1599.66 @64bit Linux из Google Repo: P) - страница загрузилась успешно

Ответ 4

Итак, вот мои выводы до сих пор

Все тесты на Mac

Chrome: показывает ошибку, подобную вашей FireFox: работает, но очень лагги (процессор i7, 8-гигабайт и SSD), этого не должно быть Safari: сбой.

Когда я проверил crashlog safari, я получил трассировку стека части, которая ее вызывает:

0   com.apple.WebCore               0x00007fff8bf08384 WebCore::RenderBlock::calcColumnWidth() + 260
1   com.apple.WebCore               0x00007fff8c89c9e7 WebCore::RenderBlock::recomputeLogicalWidth() + 119
2   com.apple.WebCore               0x00007fff8bf072eb WebCore::RenderBlock::layoutBlock(bool, int) + 139
3   com.apple.WebCore               0x00007fff8bf06f84 WebCore::RenderBlock::layout() + 52
4   com.apple.WebCore               0x00007fff8bf166d9 WebCore::RenderBlock::layoutPositionedObjects(bool) + 441
5   com.apple.WebCore               0x00007fff8bf07a98 WebCore::RenderBlock::layoutBlock(bool, int) + 2104
6   com.apple.WebCore               0x00007fff8bf06f84 WebCore::RenderBlock::layout() + 52
7   com.apple.WebCore               0x00007fff8bf06ed7 WebCore::RenderView::layout() + 759
8   com.apple.WebCore               0x00007fff8bf063b6 WebCore::FrameView::layout(bool) + 1702
9   com.apple.WebCore               0x00007fff8bf05c65 WebCore::Document::updateLayoutIgnorePendingStylesheets() + 133
10  com.apple.WebCore               0x00007fff8c0c2d72 WebCore::Element::offsetHeight() + 18
11  com.apple.WebCore               0x00007fff8c0c2d4d WebCore::jsElementOffsetHeight(JSC::ExecState*, JSC::JSValue, JSC::Identifier const&) + 13

Итак, это связанная с WebKit авария, связанная с рендерингом представлений, я предлагаю вам проверить свой код и начать удаление частей до тех пор, пока он не будет работать.

Мое первое предложение - удалить огромное количество текста, который говорит:

Brödtext som borde vara här! Brödtext som borde vara här!

и посмотрите, помогает ли это, также вы должны уменьшить размеры фоновых изображений, они огромны, и если они не убьют большинство браузеров из-за проблем с памятью, они съедят большую часть вашей полосы пропускания.

Ответ 5

Я знаю, что это странно, но иногда файлы cookie могут вызвать эту проблему, он работал у меня один раз. Удалите все файлы cookie и повторите попытку.

Ответ 6

Ваши изображения ОЧЕНЬ большие (2048x1152), и у вас есть 4 шт.

Сначала попробуйте с меньшими изображениями и давайте посмотрим, может ли Chrome работать.

Также вы должны квантифицировать ваши изображения. Определите разрешение и отправьте более мелкие изображения, если не нужно отображать большие. (мой FireFox также разбился (24.0))

Ответ 7

Во-первых, я бы попробовал комментировать ваши пять ссылок на JavaScript на сервере. Это не слишком много работает. Посмотрите, есть ли у вас значок больничной папки.

Если не появляется больничная папка, добавьте ее обратно. Потяните ее снова в Chrome. Продолжайте этот процесс, пока не найдете точку останова.

Затем отчитайте свои результаты.

Ответ 8

Я не знаю, помогло ли это, но я смог увидеть ошибку в окне инструментов Chrome.

Чтобы это увидеть: 1. Откройте новую вкладку 2. Нажмите F12, чтобы открыть инструменты для разработчиков. 3. Перейдите на сайт 4. Нажмите X на черном всплывающем меню, в котором говорится, что цель разбилась 5. Перейдите на вкладку Консоль.