文章/答案/技术大牛

发布

社区首页 >问答首页 >如何在Meteor中切换Bootswatch主题？

问如何在Meteor中切换Bootswatch主题？
EN

Stack Overflow用户

提问于 2014-03-27 16:08:31

回答 1查看 1.4K关注 0票数 0

我是第一次使用Meteor构建一个应用程序。由于可访问性问题，我们希望向用户提供两个不同的Bootswatch主题。我在这里找到了一个关于如何切换Bootswatch主题的非常有用的解释：

How to dynamically change themes after clicking a drop down menu of themes

(在接受的答案：http://jsfiddle.net/82AsF/中引用了一个方便的小提琴)

我已经尝试将提供的javascript放在myapp.html中的<head>标记中。我还试着把它放在myapp.js文件中。(然后我试着在许多不同的地方安顿下来，看看会发生什么事;-)

我尝试过的任何东西都没有起作用，似乎是流星框架“挡道”，这是可以理解的。有没有一种在Meteor应用程序中切换Bootswatch主题的方法？

meteor

bootswatch

回答 1

Stack Overflow用户

回答已采纳

发布于 2014-03-28 12:29:03

动态切换引导监视主题很容易完成，如最初引用的问题：How to dynamically change themes after clicking a drop down menu of themes中所演示的那样

流星(在我的例子中加上铁路由器)通过事件映射和<head>中发生的动态变化这一简单的事实使这一点变得复杂了一些。

另一个问题回答了如何直接处理jQuery中的事件(绕过Meteor映射)：How to handle custom jQuery events in Meteor?

下面的代码片段展示了我是如何将这两个想法结合在一起的。一切都如期而至。

var themes = {
  "default": "bootstrap311/css/bootstrap.default.min.css",
  "readable" : "bootstrap311/css/bootstrap.readable.min.css",
  "slate" : "bootstrap311/css/bootstrap.slate.min.css"
}

$(function(){
  var themesheet = $('<link href="'+themes['default']+'" rel="stylesheet" />');
  themesheet.appendTo('head');
  $('body').on('click', '.theme-link', function (e) {
    var themeurl = themes[$(this).attr('data-theme')]; 
    themesheet.attr('href',themeurl);
  });
});

票数 2

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/22693162

复制

相似问题

问如何在Meteor中切换Bootswatch主题？
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何在Meteor中切换Bootswatch主题？EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何在Meteor中切换Bootswatch主题？
EN