2009-11-06 5 views
3

Я использую метод Greasemonkey и JQuerys #css для добавления стилей CSS на страницу. Сценарий до сих пор:Greasemonkey как применить правило CSS только для печати @media?

// ==UserScript== 
// @name   www.al-anon.dk Remove inline scroll so that page content prints properly 
// @namespace  http://userscripts.org/users/103819 
// @description remove scroll from al-anon pages 
// @include  http://al-anon.dk/* 
// @require  http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js 
// ==/UserScript== 

$('#framen').css({'height': 'auto', width: 'auto'}); 
$('#menu').css({ 'display': 'none'}); 

Теперь мой вопрос: как применить последнее правило только для печати @media?

Другими словами: Если это чистый CSS Я хотел бы использовать этот синтаксис:

@media print { 
    /* style sheet for print goes here */ 
} 

Но как optain это с Greasemonkey/JQuery

ответ

3

Вы можете добавить элемент стиля вместо:

$('<style media="print">#menu {display: none;}</style>').appendTo('head'); 
+0

Да, я знаю. Но есть ли способ использовать другой способ JQuery с помощью метода #css ??? –

+0

В этом конкретном случае (где я хочу только добавить одно простое правило), я, скорее всего, приму ваш ответ. Я оставляю вопрос открытым, если появится лучшее решение :) –

3
GM_addStyle('@media print { #menu { display:none; } }'); 

Также, если вы хотите, чтобы ваш скрипт запускался в других браузерах.

/** 
* Define GM_addStyle function if one doesn't exist 
*/ 
if(typeof GM_addStyle != 'function') 
function GM_addStyle(css) 
{ 
    var style = document.createElement('style'); 
    style.innerHTML = css; 
    style.type='text/css'; 
    document.getElementsByTagName('head')[0].appendChild(style); 
}