Rép*_*pás 11 javascript css google-visualization twitter-bootstrap
每次我使用Google http://ajax.googleapis.com/ajax/static/modules/gviz/1.0/table/table.css
Charts'Table时谷歌加载器都会加载一个总是几乎杀死我的bootstrap css的东西,并且在凌晨2点我不太烦人.:)
注意:我无法修改table.css文件.
你知道任何可以阻止加载CSS文件的方法吗？
谢谢您的帮助.
PS:是的,我已经尝试过使用JS,但是表格在切换页面上重新编译,所以我应该table每次在分页时替换's classname.
She*_*row 10
如Google Chart Table API文档中所示,您可以通过设置cssClassNames选项来覆盖使用的CSS类:
使用此属性可将自定义CSS分配给表的特定元素
通过上面的链接查看文档,查看支持的每个属性的完整描述cssClassNames.
很简单,根据Google Playground Table示例,如果您覆盖所有属性,该表将(几乎)不含Google CSS.
您可以通过在playground示例中复制以下代码来尝试:
// Create and draw the visualization.
visualization = new google.visualization.Table(document.getElementById('table'));
visualization.draw(data, {
cssClassNames: {
headerRow: 'someclass',
tableRow: 'someclass',
oddTableRow: 'someclass',
selectedTableRow: 'someclass',
hoverTableRow: 'someclass',
headerCell: 'someclass',
tableCell: 'someclass',
rowNumberCell: 'someclass'
}
});
这应该让Twitter Bootstrap CSS单独使用.
加载的CSS仍会改变一些内容,但如果您只是删除该类,似乎就会消失google-visualization-table-table.你应该在每次.draw()通话后这样做.
var className = 'google-visualization-table-table';
$('.'+className).removeClass(className);
visualization = new google.visualization.Table(document.getElementById('table'));
visualization.draw(data, {
page: 'enable',
pageSize: 2,
cssClassNames: {
/* ... */
}
});
google.visualization.events.addListener(visualization , 'page',
function(event) {
var className = 'google-visualization-table-table';
$('.'+className).removeClass(className);
});
别忘了调用.removeClass()on初始化(你应该创建一个函数,就像那里:http://pastebin.com/zgJ7uftZ)
给你body上课.然后使用该类来限制CSS.
<body class="my">..</body>
.my .google-visualization-table-table { /* blah */ }
| 归档时间： |
|
| 查看次数： |
5896 次 |
| 最近记录： |