Lecture Slides on Graphics in JavaScript | CMSC 198N, Study notes of Computer Science

Material Type: Notes; Professor: Padua-Perez; Class: INTRO COMP PROG VIA WEB; Subject: Computer Science; University: University of Maryland; Term: Spring 2008;

Typology: Study notes

Pre 2010

Uploaded on 07/30/2009

koofers-user-yjf
koofers-user-yjf 🇺🇸

10 documents

1 / 6

Toggle sidebar

This page cannot be seen from the preview

Don't miss anything!

bg1
1
ANNOUNCEMENTS
Quiz #4 Take-home posted.
You don’t have to remove the contents of index.html you
added for project #1.
Don’t worry about the time background color (project #6).
Reference:
CSS Cookbook by Christopher Schmitt
ISBN-13: 978-0-596-52741-9
http://www.oreilly.com/catalog/cssckbk2/
pf3
pf4
pf5

Partial preview of the text

Download Lecture Slides on Graphics in JavaScript | CMSC 198N and more Study notes Computer Science in PDF only on Docsity!

ANNOUNCEMENTS

Quiz #4 Take-home posted.

You don’t have to remove the contents of index.html you

added for project #1.

Don’t worry about the time background color (project #6).

Reference:

CSS Cookbook by Christopher Schmitt

ISBN-13: 978-0-596-52741-

http://www.oreilly.com/catalog/cssckbk2/

GRAPHICS IN JAVASCRIPT

 JS3D

 http://www.wxs.ca/js3d/

 Library which allows you to have interactive 3d objects on your

website.

 Let’s see some examples.

 Walterzorn

 http://www.walterzorn.com/jsgraphics/jsgraphics_e.htm

 JavaScript Vector Graphics Library

 Provides graphics capabilities for JavaScript: functions to draw

circles, ellipses (ovals), polygons, etc. dynamically into a webpage.

 Ortho

 http://www.craic.com/ortho/

 2-D graphics library

ROUNDING CORNERS WITH JAVASCRIPT

 Alternative I: Using Nifty Corners Cube by Alessandro

Fulciniti

 http://www.html.it/articoli/niftycube/index.html

 Alternative II: http://www.netzgesta.de/corner/

 Read license before using.

MAKING SCALABLE IMAGES

 Define width and height of images using percentages.

 Example: scalableImage.html, scalableImage.css

 Defining only the width allows you to widen the image.

 You keep the image from expanding beyond a particular

point use the max-width property.