CSS样式表中的jQuery

Question

I'm working on making my web site fade in and out every time I click a link to another page. 每当我单击另一个页面的链接时，我都在努力使网站淡入淡出。 I need to use jQuery to do this. 我需要使用jQuery来做到这一点。 Do I need to put the jQuery code on every page or can I write jQuery into the CSS Stylesheet? 我需要在每个页面上放置jQuery代码还是可以将jQuery写入CSS样式表？ If so, how do I format the CSS Stylesheet to accept jQuery? 如果是这样，如何格式化CSS样式表以接受jQuery？

I'm experimenting with the code from this forum post: Fade Out between pages – CSS-Tricks 我正在尝试此论坛帖子中的代码：页面之间的淡入淡出– CSS技巧

Edit to question based on comments 根据评论编辑问题

So, I now know that I can't put JavaScript in CSS file. 因此，我现在知道我无法将JavaScript放入CSS文件中。 What's the best way to put JavaScript code that applies to all pages in a site? 放置适用于站点中所有页面的JavaScript代码的最佳方法是什么？ I want to write this transition code and then not have to write/edit it into every page. 我想编写此过渡代码，然后不必将其编写/编辑到每个页面中。

Answer 1

Save the JavaScript in a file with the extension .js , for example main.js . 将JavaScript保存在扩展名为.js的文件中，例如main.js Then give it a public URL, in a similar way that your CSS files are accessible from a URL. 然后提供一个公共URL，就像通过URL访问CSS文件一样。 An example URL: http://example.com/js/main.js . 示例网址： http : //example.com/js/main.js 。 You might do that by putting it in a js folder in your public_html folder on your server – it depends on your server. 您可以将其放在服务器上public_html文件夹中的js文件夹中，具体取决于服务器。

Then, near the end of each page's HTML, right above </body> , add this HTML tag: 然后，在每个页面HTML的结尾附近</body>上方，添加以下HTML标签：

<script src="/js/main.js"></script>

The script tag with a src attribute will load the JavaScript at the given URL and then run it immediately. 具有src属性的script标签将在给定的URL上加载JavaScript，然后立即运行它。

I recommend putting it at the end of your <body> element and not inside the <head> because the script prevents the rest of the page from loading and displaying to the user while the script runs. 我建议将其放在您的<body>元素的末尾，而不要放在<head>内，因为脚本会阻止页面的其余部分在脚本运行时加载并显示给用户。 If you make the script run only at the very end of the page, the page is already loaded and the user can see all of its content. 如果使脚本仅在页面的最后运行，则该页面已经加载，用户可以看到其所有内容。

Answer 2

you need to do a $.fadeout on the window.beforeunload event, bye 你需要做一个$.fadeout上window.beforeunload事件，再见

PD: in a js file, not in a stylesheet, you can´t use JS in a stylesheet. PD：在js文件中，而不是在样式表中，您不能在样式表中使用JS。 bye. 再见

CSS样式表中的jQuery

问题描述

Edit to question based on comments 根据评论编辑问题

2 个解决方案

解决方案1
1 已采纳 2013-07-29 18:58:15

解决方案2
0 2013-07-29 18:53:26

CSS样式表中的jQuery

问题描述

Edit to question based on comments 根据评论编辑问题

2 个解决方案

解决方案1 1 已采纳 2013-07-29 18:58:15

解决方案2 0 2013-07-29 18:53:26

解决方案1
1 已采纳 2013-07-29 18:58:15

解决方案2
0 2013-07-29 18:53:26