From 66dfdcf22bfa882378bf06955dfcf353c93008e9 Mon Sep 17 00:00:00 2001 From: Jessica Leach Date: Sat, 20 Jan 2018 12:30:49 +0100 Subject: [PATCH] ACDC draft added --- ACDC/elec.html | 679 ++++++++++++++++++++++++++++++++++ ACDC/gurprit.css | 31 +- ACDC/index.html | 147 ++++++-- ACDC/jquery.touchSwipe.min.js | 14 + ACDC/styles.css | 563 ++++++++++++++++++++++++++++ 5 files changed, 1378 insertions(+), 56 deletions(-) create mode 100644 ACDC/elec.html create mode 100755 ACDC/jquery.touchSwipe.min.js create mode 100644 ACDC/styles.css diff --git a/ACDC/elec.html b/ACDC/elec.html new file mode 100644 index 0000000..e29414b --- /dev/null +++ b/ACDC/elec.html @@ -0,0 +1,679 @@ + + + + Responsive/Skrollr Template + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ +
0
+
Glosary
+ + +
+

ELECTRICAL CIRCUITS, AC AND DC

+

Electrical circuits are connected in series or in parallel.

+

Circuit components are shown as symbols.

+

There are two types of current, alternating current (AC) and direct current (DC).

+

(Well, start scrolling already!)

+
+ + + + + +
+

Electrical symbols

+ + +
+ + + + + + + + +
+
+ + +
+
+ + ammeter +

ammeter

+ + +
+ +
+ + battery +

battery

+ + + +
+ +
+ + capacitor +

capacitor

+ + + +
+
+ + cell +

cell

+ + + +
+
+ + closed-switch +

closed switch

+ + + + +
+
+ + +
+
+ + +
+
+ + +
+
+ + diode +

diode

+ + + + + +
+ +
+ + fuse +

fuse

+ + + +
+ +
+ + lamp +

lamp

+ + +
+
+ + light-dependent-resistor +

light dependent resistor

+ + + +
+
+ light-emitting-diode +

light emitting diode

+ + + + + +
+
+ + +
+
+ +
+
+ + +
+
+ + open-switch +

open switch

+ + + +
+ +
+ + voltmeter +

voltmeter

+ + + + +
+ +
+ + resistor +

resistor

+ + + +
+
+ + thermistor +

thermistor

+ + + + +
+
+ + variable-resistor +

variable resistor

+ + + + +
+
+ + +
+
+ + +
+ +
+ +
+
+ + + + + + +
+

Properties of circuits

+
+ +
+

The components in electrical circuits can be connected in series or in parallel.

+
+ + + +
+

Series connections

+

Components that are connected one after another on the same loop of the circuit are connected in series. The current that flows through each component connected in series is the same.

+
+ +
+

Two lamps connected in series

+

The circuit diagram shows a circuit with two lamps connected in series. If one lamp breaks, the other lamp will not light.

+ + series +

Two lamps connected in series with an open switch and a cell

+ +
+ +
+

Series circuits are useful if you want a warning that one of the components in the circuit has failed. For example, a circuit breaker or fuse must be connected in series in order for it to work. If Christmas tree lights all go out when one bulb breaks, they are connected in series.

+

The sum of all the potential differences across the components in a series circuit is equal to the total potential difference across the power supply.

+
+ +
+

Parallel connections

+ +

Components that are connected on separate loops are connected in parallel. The current is shared between each component connected in parallel. The total amount of current flowing into the junction, or split, is equal to the total current flowing out. The current is described as being conserved.

+ +

Two lamps connected in parallel

+ +

The circuit diagram shows a circuit with two lamps connected in parallel. If one lamp breaks, the other lamp will still light.

+ + series + +

Two lamps connected in parallel with an open switch and a cell

+ +

The lights in most houses are connected in parallel. This means that they all receive the full voltage and if one bulb breaks the others remain on.

+ +

For a parallel circuit the current from the electrical supply is greater than the current in each branch. The sum of all the current in every branch is equal to the current from the electrical supply.

+ + + + + +
+ + + + + + + +
+

AC and DC

+
+ +
+

AC and DC

+ +

AC electricity

+ +

Alternating current

+ +

If the current constantly changes direction it is called alternating current, or AC. Mains electricity is an AC supply. The UK mains supply is about 230 V. It has a frequency of 50 Hz, which means that it changes direction and back again 50 times a second. The diagram shows an oscilloscope screen displaying the signal from an AC supply.

+ +
+ +
+

DC electricity

+ +

Direct current

+ +

If the current flows in only one direction it is called direct current, or DC. Batteries and solar cells supply DC electricity. A typical battery may supply 1.5 V. The diagram shows an oscilloscope screen displaying the signal from a DC supply.

+ + + +
+ +
+ +
+ +
+

For example, you can create interesting transitions by making things slide in and out using top, bottom, right and left.

+
+ +
+

Rotate in and out to add a dynamic effect using transform.

+
+ +
+

Or disappear completely using opacity.

+
+ + +
+

Transitions

+
+ +
+

Directions, transform and opacity are all different values that can be used within a data attribute.

+
+ + + + +
+

AC and DC

+
+ +
+

You can also do fun things with color, like change the background color

+
+ +
+

and text using RGB values.

+
+ +
+

You can even + + change + the + color + of individual words.

+
+ +
+

That covers some of the basics. Swipe or arrow-right over to go to page 2.

+
+ + + + + + + + + +
+
+ +
+
+ + + +
+ + + + + + + + + + + + + + + + + + + diff --git a/ACDC/gurprit.css b/ACDC/gurprit.css index 07f10bd..9eef032 100644 --- a/ACDC/gurprit.css +++ b/ACDC/gurprit.css @@ -11,7 +11,7 @@ body {background:#FFF;} #skrollr-body{width:100%;} #sd {width:100%;text-align:center; margin:300px auto 0;} #intro { - margin:900px 15% 0; + margin:1200px 15% 0; zoom: 1; filter: alpha(opacity=70); opacity: 0.7; @@ -19,27 +19,28 @@ body {background:#FFF;} z-index:200; position:relative; } -h1, h2 {font:83px 'Comet Text Bold', Verdana, Geneva, sans-serif; padding:0 0 20px 0; } -h2 {line-height:70px;} +h1, h2 {font:83px 'Comet Text Bold', Courier, Geneva, sans-serif; padding:0 0 20px 0; } +h2 {font:44px 'Comet Text Bold', Courier, Geneva, sans-serif; padding:0 0 20px 0; } + +/*h2 {line-height:70px;}*/ -#intro h1 {font:80px/70px 'Comet Text Bold', Verdana, Geneva, sans-serif; padding:0 0 0 15px; } .pyramid { -webkit-transform:rotate(133deg); -moz-transform:rotate(133deg); -o-transform:rotate(133deg); /* filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=1.3); */ -ms-transform:rotate(133deg); - width:1088px; - height:1088px; - background:#DED200; + width:388px; + height:188px; + background:#CF236B; position:absolute; } -.one.pyramid {position:absolute;left:14%;top:1440px;} -.two.pyramid {position:absolute;left:35%;top:1470px;} +.one.pyramid {position:absolute;left:14%;top:1940px;} +.two.pyramid {position:absolute;left:55%;top:1970px;} #gd{position:absolute;left:21.5%;top:-560px; z-index:200;} .gu {position:absolute; z-index:200;} .gu.one -{left:-320px;top:60px;} +{left:-920px;top:60px;} .gu.two {right:-600px;top:60px;} #bb { @@ -188,6 +189,8 @@ h2 {line-height:70px;} .pw { position:relative; background:url('series.png'); + background-repeat: no-repeat; + width:442px; height:442px; float:left; @@ -208,7 +211,6 @@ h2 {line-height:70px;} padding:40px 0 0 0; float: right; width: 525px; - font:14px/28px 'Comet Text Bold', Verdana, Geneva, sans-serif; letter-spacing:1px; } #tweet a { @@ -222,9 +224,7 @@ h2 {line-height:70px;} float: right; width: 525px; } -#instagram img{padding:0 0 15px 15px;} #foot {background:#F27A40; clear:both;} -#foot p {font:50px/55px 'Comet Text Bold', Verdana, Geneva, sans-serif; text-align:center; padding:150px 0 50px; } #foot a {color:#FFF;text-decoration:none;} #tp {background-image:url('/2013/skrollr/img/pbl.png'); background-position:0px 0px; height:80px; width:100%;position:relative;} #bp {background-image:url('/2013/skrollr/img/pbd.png'); background-position:0px 0px; height:80px; width:100%; position:relative;} @@ -286,7 +286,6 @@ span.jta-tweet-timestamp {padding: 0 1px 0 5px;} margin: 20px 0; width: 100%; display: block; - font:25px/30px 'Comet Text Bold', Verdana, Geneva, sans-serif; } .popup { @@ -329,6 +328,8 @@ span.jta-tweet-timestamp {padding: 0 1px 0 5px;} #ss1 { background-image: url('ac.png'); + background-repeat: no-repeat; + } .header { @@ -342,7 +343,7 @@ span.jta-tweet-timestamp {padding: 0 1px 0 5px;} font-style: oblique; font-weight: 900; font-size: 50pt; - color: #5FC3E4; + color: #3b3b3b; text-transform: uppercase; background-image: url('imgs/white-noise2.gif'); background-repeat: no-repeat; diff --git a/ACDC/index.html b/ACDC/index.html index 5486584..d06987c 100644 --- a/ACDC/index.html +++ b/ACDC/index.html @@ -75,7 +75,13 @@

Electrical symbols

ammeter

@@ -87,7 +93,12 @@

Electrical symbols

battery

@@ -100,7 +111,10 @@

Electrical symbols

capacitor

@@ -112,7 +126,12 @@

Electrical symbols

cell

@@ -123,7 +142,11 @@

Electrical symbols

closed switch

@@ -147,7 +170,12 @@

Electrical symbols

diode

@@ -161,7 +189,12 @@

Electrical symbols

fuse

@@ -174,7 +207,11 @@

Electrical symbols

lamp

@@ -184,7 +221,12 @@

Electrical symbols

light dependent resistor

@@ -195,7 +237,12 @@

Electrical symbols

light emitting diode

@@ -220,7 +267,10 @@

Electrical symbols

open switch

@@ -228,11 +278,13 @@

Electrical symbols

- voltmeter + voltmeter

voltmeter

@@ -246,7 +298,10 @@

Electrical symbols

resistor

@@ -257,7 +312,9 @@

Electrical symbols

thermistor

@@ -270,7 +327,10 @@

Electrical symbols

variable resistor

@@ -286,15 +346,11 @@

Electrical symbols

-
-
+
+
-
green
-
green
-
green
-
-
+
@@ -304,7 +360,21 @@

Electrical symbols

-

Design + Development

+
+ +

Properties of circuits

+ +

The components in electrical circuits can be connected in series or in parallel.

+

Series connections

+

Components that are connected one after another on the same loop of the circuit are connected in series. The current that flows through each component connected in series is the same.

+

Two lamps connected in series

+

The circuit diagram shows a circuit with two lamps connected in series. If one lamp breaks, the other lamp will not light. Two lamps connected in series with an open switch and a cell. Two lamps connected in series with an open switch and a cell Series circuits are useful if you want a warning that one of the components in the circuit has failed. For example, a circuit breaker or fuse must be connected in series in order for it to work. If Christmas tree lights all go out when one bulb. breaks, they are connected in series. The sum of all the potential differences across the components in a series circuit is equal to the total potential difference across the power supply.

+
+
green
+
green +
+
+
@@ -314,11 +384,6 @@

Electrical symbols

    -
  • Capital Parties || Awesome Sauce Web Design + Development
    • -
  • ju5t.in || Awesome Sauce Web Design + Development
    • -
  • The Catbeast of London || Awesome Sauce Web Design + Development
    • -
  • Comet B2B || Awesome Sauce Web Design + Development
    • -
  • Nicola Brockley CV || Awesome Sauce Web Design + Development
@@ -394,17 +459,17 @@

Electrical symbols

-

Properties of circuits

+

Properties of circuits

The components in electrical circuits can be connected in series or in parallel.

-

Series connections

+

Series connections

series

Components that are connected one after another on the same loop of the circuit are connected in series. The current that flows through each component connected in series is the same.

-

Two lamps connected in series

+

Two lamps connected in series

The circuit diagram shows a circuit with two lamps connected in series. If one lamp breaks, the other lamp will not light. Two lamps connected in series with an open switch and a cell. @@ -412,12 +477,12 @@

Electrical symbols

Series circuits are useful if you want a warning that one of the components in the circuit has failed. For example, a circuit breaker or fuse must be connected in series in order for it to work. If Christmas tree lights all go out when one bulb breaks, they are connected in series. The sum of all the potential differences across the components in a series circuit is equal to the total potential difference across the power supply. -

Parallel connections

+

Parallel connections

parallel Components that are connected on separate loops are connected in parallel. The current is shared between each component connected in parallel. The total amount of current flowing into the junction, or split, is equal to the total current flowing out. The current is described as being conserved. -

Two lamps connected in parallel

+

Two lamps connected in parallel

The circuit diagram shows a circuit with two lamps connected in parallel. If one lamp breaks, the other lamp will still light. Two lamps connected in parallel with an open switch and a cell. @@ -429,7 +494,7 @@

Electrical symbols