I'm using Greasemonkey and JQuerys #css method to add css styles to a page. Script so far:
我正在使用Greasemonkey和JQuerys #css方法向页面添加css样式。脚本到目前为止:
// ==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'});
Now my question is how do I apply the last rule only for @media print?
现在我的问题是如何仅为@media打印应用最后一条规则?
In other words: If this were clean CSS I would use this syntax:
换句话说:如果这是干净的CSS,我会使用这种语法:
@media print {
/* style sheet for print goes here */
}
But how to optain this with Greasemonkey/JQuery
但是如何使用Greasemonkey / JQuery来实现这一点
2 个解决方案
#1
3
You could append a style element instead:
您可以添加样式元素:
$('<style media="print">#menu {display: none;}</style>').appendTo('head');
#2
3
GM_addStyle('@media print { #menu { display:none; } }');
Also if you want your script to run in other browsers.
此外,如果您希望您的脚本在其他浏览器中运行。
/**
* 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);
}
#1
3
You could append a style element instead:
您可以添加样式元素:
$('<style media="print">#menu {display: none;}</style>').appendTo('head');
#2
3
GM_addStyle('@media print { #menu { display:none; } }');
Also if you want your script to run in other browsers.
此外,如果您希望您的脚本在其他浏览器中运行。
/**
* 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);
}