AGCJ 407: Web Authoring in Agricultural Communications

Download Report

Transcript AGCJ 407: Web Authoring in Agricultural Communications 

Advanced Elements
&
Advanced HTML Codes
AGCJ 407
Advanced Elements
 Overview:

Interactivity elements
 Java


Script
Mouseovers
Animation effects
Interactivity elements
 What is Java Script?



A scripting language designed for use
within a Web page and/or on a Web server
Used to create special effects
Elements such as links, images and forms
can be manipulated using this powerful
technology
Interactivity elements
Java Script  Can help you make
 Dynamic Splash Screen
 Pausing Up and Down Menu Scroller
 Banner Rotator
 Use Java Script in your HTML code

Make a Table Sorter:
 http://www.brainjar.com/dhtml/tablesort/
 Example:
http://www.brainjar.com/dhtml/tablesort/demo.html
Interactivity elements
 Java Script
 A great Java Script source:
 Keep it handy if you want to make buttons,
calendars, games, and etc.


http://javascript.internet.com/
A great link to the Java Script Learning Center

http://www.javascriptmall.com/learn/contents.htm
 When using Java, choose selections with care
and make sure that scripts will enhance your
visitors’ experience, encouraging future returns
to your site
Mouseovers
 You can have fonts or buttons change colors
 This effect is accomplished by using a special
"style" tag
 Only one such tag may be used per page
 To create the effect of changing text colors on links
as mouseovers, insert the tag into the head portion
of the page:
<style>
<!--a:hover{color:ff6666; text-decoration:none; backgroundcolor:none; }-->
</style>

Tip: Always include a space after the semicolon
Mouseovers
 Insert this into page <head> area :
<style><!--a:hover{color:ff6666; text-decoration:none;
background-color:none; }--></style>

Customize your style with color,
underlining, type style, and background
color; go to:
http://www.best-web-design.com/specialeffects1.html
Mouseovers
 More Mouseover images and tips:
http://www.dynamicdrive.com/dynamicindex15/index.html
 Pop-up
images, images that shake and
images that can change or rollover
http://www.dynamicdrive.com/dynamicindex13/index.html
 More
mouse and cursor functions
Animation effects
Java can allows animation with text or
images

Create you own animated gifs
http://hometown.aol.com/royalef/gifmakf.htm

Animation using Image Ready
http://gradcenter.marlboro.edu/~techgirls/le
aders2001/Web/animatedinstruction.htm
Some animation effects
http://www.animfactory.com
The End
 Have fun writing Java
 Make good choices
 Selections should add, not distract,
visitors’ experience on your Web site