Graphics Considerations

Slides:



Advertisements
Similar presentations
HTML Images. The Image Tag and the Src Attribute  In HTML, images are defined with the tag.  In HTML, images are defined with the tag.  The tag is.
Advertisements

1 CS101 Introduction to Computing Lecture 41 Images & Animation (Web Development Lecture 14)
Linking Your Web Pages Together. Links… index.htmunit4.htm Evaluation of web graphics GIF vs. JPEG Web photo album To link the lines in index.htm to the.
In this lecture, you will learn: ❑ How to link between pages of your site ❑ How to link to other sites ❑ How to structure the folders on your web site.
LIST- HYPERLINK- IMAGES
MSc. Publishing on WWW JavaScript. What is JavaScript? A scripting language devised by Netscape Adds functionality to web pages by: Embedding code into.
Javascript Document Object Model. How to use JavaScript  JavaScript can be embedded into your html pages in a couple of ways  in elements in both and.
CM143 - Web Week 2 Basic HTML. Links and Image Tags.
JavaScript 101 Lesson 5: Introduction to Events. Lesson Topics Event driven programming Events and event handlers The onClick event handler for hyperlinks.
JavaScript, Third Edition
Server vs Client-side validation. JavaScript JavaScript is an object-based language. JavaScript is based on manipulating objects by modifying an object’s.
Agenda Links External and Internet Links Anchor Tag Text Hyperlinks Image Hyperlinks Images Image Attributes: src, alt, width, height, align, border.
CSCE Chapter 5 (Links, Images, & Multimedia) CSCE General Applications Programming Benito Mendoza 1 By Benito Mendoza Department.
1 Goals and Objectives Goals Goals Understand how JavaScript makes it possible to interact with web pages, minimizes client/server traffic, enables verification.
Adding User Interactivity – Lesson 51 Adding User Interactivity Lesson 5.
Images (1) Three most popular formats – Graphics Interchange Format (GIF) – Joint Photographic Experts Group (JPEG) – Portable Network Graphics (PNG) –
CSS Class 7 Add JavaScript to your page Add event handlers Validate a form Open a new window Hide and show elements Swap images Debug JavaScript.
Adding Image, audio and video files to web pages Basharat Mahmood, Department of Computer Science,CIIT,Islamabad, Pakistan. 1.
1.  Use the anchor element to link from page to page  Configure absolute, relative, and hyperlinks  Configure relative hyperlinks to web pages.
Introduction to JavaScript 41 Introduction to Programming the WWW I CMSC Winter 2004 Lecture 17.
XHTML1 Images N100 Building a Simple Web Page. XHTML2 The Element The src attribute specifies the filename of an image file To include the src attribute.
JavaScript - A Web Script Language Fred Durao
DOM Animation Changing the DOM objects over time.
HTML5 Audio and Video. Slide 2 History Playing audio and video used to be something of a novelty You would embed a control (with the element) into your.
Chapter 2: Variables, Functions, Objects, and Events JavaScript - Introductory.
Web Design–Part 2 Links, Graphics, Tables, and Color Explorers Guild May 25, 2000.
HTML Basic. What is HTML HTML is a language for describing web pages. HTML stands for Hyper Text Markup Language HTML is not a programming language, it.
JavaScript, Fourth Edition Chapter 4 Manipulating the Browser Object Model.
HTML Images Dr. Baker Abdalahq. The Image Tag and the Src Attribute In HTML, images are defined with the tag. In HTML, images are defined with the tag.
HTML (Hyper Text Markup Language) Lecture II. Review Writing HTML files for web pages – efficient compact – fundamental. Text files with htm extension.
1 CSC160 Chapter 7: Events and Event Handlers. 2 Outline Event and event handlers onClick event handler onMouseOver event handler onMouseOut event handler.
HTML IMAGES. CONTENTS IMG Tag Alt Attribute Setting Width and Height Of An Image Summary Exercise.
Introduction to HTML. _______________________________________________________________________________________________________________ 2 Outline Key issues.
Lesson 6 Links. Creating Folders  For every web site/page, you need to create a separate folder  The computer cannot find links if they are not stored.
HTML CS 105. Page Structure HTML elements control the details of how a page gets displayed. Every HTML document has the following basic structure: … …
Slide 1 Graphics (Characteristics 1) Images have various characteristics that affect performance Size (number of pixels) – Large images can be several.
Document Object Model Nasrullah. DOM When a page is loaded,browser creates a Document Object Model of the Page.
Drop-down box. Objectives Learn the HTML syntax of a drop-down list javascript properties of a list/menu: length options selectedIndex The location sub-object.
LESSON : EVENTS AND FORM VALIDATION -JAVASCRIPT. EVENTS CLICK.
Session: 4. © Aptech Ltd. 2Creating Hyperlinks and Anchors / Session 4  Describe hyperlinks  Explain absolute and relative paths  Explain how to hyperlink.
The “Quick Change” Method of Web Design. Create Your Design Create and cut up the graphics for your web site. Create a masterstyle sheet. Name it “plainmasterstylesheet.html.
Chapter 6 Murach's JavaScript and jQuery, C6© 2012, Mike Murach & Associates, Inc.Slide 1.
HTML. INDEX Introduction to HTML Creating Web Pages Commands And Tags Web Page.
HTML Tutorial. What is HTML HTML is a markup language for describing web documents (web pages) HTML documents are described by HTML tags Each HTML tag.
Revision Webpage design HTML.   FACE  Attributes  Marquee  Define the following terms.
The Web Wizard’s Guide To JavaScript Chapter 4 Image Swapping.
Introduction to HTML 4.0 Getting Started – Links, Images, Font, and List Teacher: Mr. Ho.
Web Site Design Unit 11.3A: Web programming. Tags and Elements O h1 O p O h6 O li O Ol O Ul O Strong O Bold O Emphasis O Sub O Sup O How many standard.
COM621: Advanced Interactive Web Development Lecture 6 – JavaScript (cont.)
Chapter 4 Java Script – Part2. 2 Location object Properties Properties href – whole path will be displayed. ex: window.location.href ( see example 11)
TNPW1 Ing. Jiří Štěpánek.  Tags  Marks for elements ▪ Pair ▪ Start and end tag ( Paragraph text ) ▪ Single ▪ Only start tag, according to XHTML 1.0.
HTML basics
JavaScript and HTML Simple Event Handling 11-May-18.
Hosted by Coach Slanina
Simplest Rollover (nonJavaScript!)
JavaScript and HTML Simple Event Handling 19-Sep-18.
The Web Wizard’s Guide To DHTML and CSS
Graphics (Characteristics 1)
Basic HTML and Embed Codes
Working with Special Effects
The Web Wizard’s Guide To JavaScript
Pertemuan 1b
Lesson 4: Hyperlinks.
Windows The Window Objects.
Pertemuan 1 Desain web Pertemuan 1
JavaScript and Forms Kevin Harville.
JavaScript.
JavaScript and HTML Simple Event Handling 26-Aug-19.
JavaScript and HTML Simple Event Handling 4-Oct-19.
Presentation transcript:

Graphics Considerations Kevin Harville

Using Links The href attribute can contain javascript instead of a URL. <a href="javascript:alert('hello')"> This is valid in anchor tags and area tags of image maps.

You can still have an event handler. <a href="javascript:alert('hello')" onMouseOver="alert('hi')">

Images Array Like most page elements, images in a document are automatically members of the images array. You can refer to images by their array index or by name.

Preloading Images We preload images to make rollovers and other image changes instant. Rollovers are images, such as buttons, that change when you put the mouse over them. If the image had to be loaded at that time it would take to long for their to be any point in having the rollover.

Images Are Objects Objects are made with the new keyword. myImage = new Image(); myImage.src = "myPic.jpg" Src is a property of myImage. Images have other properties, such as height and width.