2014-12-25 2 views
0

У меня есть веб-страница, которая скрывает и показывает различные фрагменты, используя функции jQuery's hide() и show() в ответ на действия пользователя. Если пользователь печатает страницу, я хочу, чтобы все эти части были показаны, и у меня есть раздел моей таблицы стилей, чтобы сделать это. Однако функции jQuery переопределяют это. Как я могу решить эту проблему?jQuery hide/show не играют хорошо с @media print

+0

почему вы не временно 'шоу() 'все они перед печатью? –

+0

@ Николас, как я могу переместить Javascript в пункт меню «Печать» браузера? Например, 'window.onbeforeprint' не является стандартизованным или кросс-браузерным. – Mark

+1

err ... http: //stackoverflow.com/questions/1234008/detecting-browser-print-event .. Это действительно хак. Я бы предположил, что если вы на ранних этапах развития переосмыслите, если вам действительно нужно использовать 'hide()' и 'show()'. Возможно, вам нужно просто абстрагироваться от функции hide and show и использовать свой собственный CSS-класс для переключения - как описано ниже - это хорошо работает с '@media print' –

ответ

1

HTML

<div class="pieces">hello world</div> 

если использовать JQuery hide(); он будет объявлен выходной

<div class="pieces" style="display: none;">hello world</div> 

свойство стиля и их приоритет над другими здесь. поэтому имеет решение, добавить класс display:none;

<style> 
.hide{display:none;} 

@media print{ 

    .hide{display:block;} 
} 
</style> 
<div class="pieces hide">hello world</div> 

использование $('.pieces').addClass('hide') вместо $('.pieces').hide()

$('.pieces').removeClass('hide') вместо $('.pieces').show()

печати демо http://jsfiddle.net/abj01sa7/3/show/

Смежные вопросы