1 / 42

Introduction to Functions in Microsoft Visual Studio .NET Development Environment

Learn how to create and use functions in Microsoft Visual Studio .NET 2003. Follow step-by-step instructions to design HTML pages and implement functions using JavaScript. Enhance your coding skills and understanding of event-driven programming.

mariac
Download Presentation

Introduction to Functions in Microsoft Visual Studio .NET Development Environment

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Using Microsoft Visual Studio .NET Development Environment and Introducing Functions

  2. Go to Start/Programs/Microsoft Visual Studio .NET 2003/Microsoft Visual Studio .NET 2003

  3. First-time start up screen

  4. File/New/File

  5. New File dialog box: choose HTML Page, click Open button

  6. HTML Page in Design View

  7. HTML Page in HTML View

  8. Return to Design, place cursor over Toolbox, click on tack icon to lock in place.

  9. Click on the HTML button on the Toolbox

  10. Click on Table/Insert/Table

  11. Use the Insert Table Dialog box to select the number of rows, columns, etc.

  12. Result in Design view

  13. Result in HTML view

  14. Insert a Flow layout panel (div) in column 1 and another table (6 rows, a column) in column 2

  15. Result in HTML view

  16. Click the Save File button

  17. Save File As Dialog Box

  18. Place the cursor in the top row of the right column and the click on the Button button of the Toolbox

  19. Right click on the button and choose Properties.

  20. Change the properties of the button

  21. Highlight the div and click on the ellipsis next to the style

  22. Click on the Background button, click on the dropdown listbox next to Color

  23. Select black from the list of colors.

  24. Result of color selection

  25. Double click on button

  26. Result of double clicking: gives a boiler plate of function

  27. Declare some variables in the script region

  28. Let us define the function MakeColor()

  29. Function • A function is a set of statements that we separate from the rest of the code and give a name. • To execute the code we must “call” the function. • It is possible to return a result (as the prompt function does). • One reason for doing this is if the same set of code might be used in a number of different colors.

  30. The butRedIncrease_onclick() function

  31. Events and Functions • Another reason for a function is to have code that is executed when an event (such as the user clicking a button) is raised.

  32. Event calling function

  33. outerHTML code

  34. outerHTML versus document.write() • Previously we used document.write() to add new HTML code to a page. • If there is some pre-existing HTML code on the page we can change it by using the outerHTML property. • There is a similar construct known as innerHTML. • The pre-existing HTML tag must have an id attribute so that we can refer to it.

  35. The div’s id attribute

  36. Add a second button.

  37. Click on the Style ellipsis, click on Position, set the Width property

  38. New Function

  39. The Green functions

  40. Result in Browser

  41. Result in Browser (II)

  42. References • Beginning JavaScript, Paul Wilton • Functions: p. 92 • Buttons: p. 195 • outerHTML: p. 462 • http://www.webopedia.com

More Related