Skip to content

Commit 8740d16

Browse files
committed
添加requirejs的练习
1 parent d0fa04c commit 8740d16

39 files changed

+14970
-178
lines changed

.idea/codeStyleSettings.xml

Lines changed: 9 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

.idea/watcherTasks.xml

Lines changed: 25 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

.idea/workspace.xml

Lines changed: 260 additions & 178 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

css/index.scss

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
$color: #fff;
2+
3+
body {
4+
font-family: "微软雅黑";
5+
transition: all 1s ease-out;
6+
}
7+
8+
ul {
9+
list-style: none;
10+
11+
li {
12+
display: block;
13+
color: $color;
14+
}
15+
}
16+
17+
a {
18+
color: $color;
19+
}
20+
21+
div {
22+
padding: 0;
23+
margin: 0;
24+
}

html/bootstrap-ScrollSpy.html

Lines changed: 96 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,96 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="utf-8">
5+
<title>Bootstrap ScrollSpy Example</title>
6+
<meta name="description" content="Bootstrap ScrollSpy example. You may also learn usage of navbar and dropdown.">
7+
<link href="../lib/bootstrap/css/bootstrap.css" rel="stylesheet">
8+
<style type="text/css">
9+
.scrollspy-example {
10+
height: 200px;
11+
overflow: auto;
12+
position: relative;
13+
}
14+
</style>
15+
</head>
16+
<body>
17+
<div class="span9 columns">
18+
<h2>The links of the following navbar is going to be highlighted</h2>
19+
20+
<p>Scroll the area below and watch the navigation update. The dropdown sub items will be highlighted as well. Try
21+
it!</p>
22+
23+
<div id="navbarExample" class="navbar navbar-static">
24+
<div class="navbar-inner">
25+
<div class="container" style="width: auto;">
26+
<a class="brand" href="#">w3cschool</a>
27+
<ul class="nav">
28+
<li class="active"><a href="#php">PHP</a></li>
29+
<li class=""><a href="#js">JS</a></li>
30+
<li class="dropdown">
31+
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Databases<b class="caret"></b></a>
32+
<ul class="dropdown-menu">
33+
<li class=""><a href="#mysql">MySQL</a></li>
34+
<li class=""><a href="#pgsql">PostgreSQL</a></li>
35+
<li class=""><a href="#mgdb">MongoDB</a></li>
36+
</ul>
37+
</li>
38+
</ul>
39+
</div>
40+
</div>
41+
</div>
42+
<div data-spy="scroll" data-target="#navbarExample" data-offset="50" class="scrollspy-example">
43+
<h4 id="php">PHP</h4>
44+
45+
<p>PHP, an acronym for Hypertext Preprocessor, is a widely-used open source general-purpose scripting language.
46+
It is an HTML embedded scripting language and is especially suited for web development. The basic syntax of
47+
PHP is similar to C, Java, and Perl, and is easy to learn. PHP is used for creating interactive and dynamic
48+
web pages quickly, but you can do much more with PHP.
49+
</p>
50+
<h4 id="js">JS</h4>
51+
52+
<p>
53+
JavaScript is a cross-platform, object-oriented scripting language developed by Netscape. JavaScript was
54+
created by Netscape programmer Brendan Eich. It was first released under the name of LiveScript as part of
55+
Netscape Navigator 2.0 in September 1995. It was renamed JavaScript on December 4, 1995. As JavaScript works
56+
on the client side, It is mostly used for client-side web development.
57+
</p>
58+
<h4 id="mysql">MySQL</h4>
59+
60+
<p>
61+
MySQL tutorial of w3cschool is a comprhensive tutorial to learn MySQL. We have hundreds of examples covered,
62+
often with PHP code. This helps you to learn how to create PHP-MySQL based web applications.
63+
</p>
64+
<h4 id="pgsql">PostgreSQL</h4>
65+
66+
<p>
67+
In 1986 the Defense Advanced Research Projects Agency (DARPA), the Army Research Office (ARO), the National
68+
Science Foundation (NSF), and ESL, Inc sponsored Berkeley POSTGRES Project which was led by Michael
69+
Stonebrakessr. In 1987 the first demo version of the project is released. In June 1989, Version 1 was
70+
released to some external users. Version 2 and 3 were released in 1990 and 1991. Version 3 had support for
71+
multiple storage managers, an query executor was improved, rule system was rewritten. After that, POSTGRES
72+
has been started to be implemented in various research and development projects. For example, in late 1992,
73+
POSTGRES became the primary data manager for the Sequoia 2000 scientific computing project4. User community
74+
around the project also has been started increasing; by 1993, it was doubled.
75+
</p>
76+
<h4 id="mgdb">MongoDB</h4>
77+
78+
<p>
79+
The term NoSQL was coined by Carlo Strozzi in the year 1998. He used this term to name his Open Source,
80+
Light Weight, DataBase which did not have an SQL interface.In the early 2009, when last.fm wanted to
81+
organize an event on open-source distributed databases, Eric Evans, a Rackspace employee, reused the term to
82+
refer databases which are non-relational, distributed, and does not conform to atomicity, consistency,
83+
isolation, durability - four obvious features of traditional relational database systems.</p>
84+
85+
<p>After reading the largest third party online MySQL tutorial by w3cschool, you will be able to install, manage
86+
and develop PHP-MySQL web applications by your own. We have a comprehensive, SQL TUTORIAL, which will help
87+
you to understand how to prepare queries to fetch data against various conditions.
88+
</p>
89+
</div>
90+
</div>
91+
<hr>
92+
<script src="../lib/jquery-1.11/jquery-1.11.1.min.js"></script>
93+
<script src="../lib/bootstrap/js/dropdown.js"></script>
94+
<script src="../lib/bootstrap/js/scrollspy.js"></script>
95+
</body>
96+
</html>

html/index.html

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8">
5+
<title></title>
6+
</head>
7+
<body>
8+
9+
</body>
10+
<script src="../lib/require/require.js" data-main="../js/index"></script>
11+
<!--<script src="../js/index.js"></script>-->
12+
</html>

images/toolbar.png

33 KB
Loading

images/toolbar_img.png

25.7 KB
Loading

js/index.js

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
require.config({
2+
paths:{
3+
jquery:'../lib/jquery-1.11/jquery-1.11.1.min'
4+
}
5+
});
6+
7+
8+
require(['jquery'], function ($) {
9+
10+
$('body').css("background","red");
11+
12+
});

0 commit comments

Comments
 (0)