_design_for_the_WWW
_week: 1 . 2 . 3 . 4 . 5 . 6 . 7 . 8 . 9 . 10 . 11 . 12 .





TOWSON: FALL 2017

last week :
- Projects 1 & 2 should be uploaded

you should also have:
**site structure and a wire frame

This week:

- CSS positioning & other fun stuff
- "smoothScrolling"

Week #11


**Talk about Grades
- site structure and a wire frame

Talk about "PROJECT #3"


* Branding, identity, & logo design

examples:
- christhurman.com
- studioix.com
- whirlpool.com

some review...

- CSS positioning & other fun stuff



Smooth Scrolling : EXAMPLE

* Source
Also: " floating nav"

<!-- **********************CSS goes in the <head> ********************* -->
<style>
*{
margin:0px;
padding:0px;
}
#nav{
padding:10px;
position:fixed;
top:0px;
width:100%;
height:100px;
background-color:#FFF;
}
#home{
padding:10px;
padding-top:150px;
height:250px;
background-color:#FC6;
width:100%

}
#div1{
padding:10px;
padding-top:150px;
height:750px;
background-color:#6FC;
width:100%

}
#div2{
padding:10px;
padding-top:150px;
height:750px;
background-color:#F9C;
width:100%

}
</style>



HTML:


<div id="nav">
<a href='#top'class="smoothScroll">HOME</a>
<a href="#div1" class="smoothScroll">div1</a>
<a href="#div2" class="smoothScroll">div2</a>
</div><!-- END NAV -->

<a name="top"></a>
<div id="home">
Home / 'top'

</div>

<a name="div1"></a>
<div id="div1">
div #1
</div>
<a name="div2"></a>
<div id="div2">
div #2
</div>



JavaScript:

*JavaScript & link to jQuery





Homework :

* Keep working on "Project #3"