Landing : Athabascau University

Group members: this is the place for your learning diary. Use this to post your zipped-up site at least once each unit, and your reflections as often as you wish (at least once per unit). Please write your reflections directly in the post, not as attached files. Where you do need to attach documents, such as for unit 1 designs, use PDF, PNG or JPG formats. You can attach files using the 'Embed content' link in the editor.

QUICK COURSE LINKS:  Add blog post - Read latest group postsFAQs: Course process : Site design : HTML : CSS : JavaScript : JQuery : AJAX : MiscPodcasts for each unit

Updated resource pages:  Unit 1 - Unit 2  - Unit 3Units 4 & 5 - Unit 6 - Unit 7

mportant notice: the student web server is unavailable. Until this is fixed, we do not require you to upload your site to the student server. See Running a web server on your local machine for details of how to meet the requirements for the final unit

Unit 4: Helpful Blogs & Websites

  • Public
By John Borg in the group COMP 266 August 16, 2019 - 5:01pm

Hey all,

While woking on this unit, I found myself constantly referring to the useful websites that are linked below. The resources vary in complexity from JavaScript introductions, to support for creating animation control programs. 

 

Firstly, I wanted a brief introduction to JavaScript and found a site that encompassed exactly what I was looking for. It was especially perfect for learning more about in-browser & server-side JavaScript programs. I felt this page to be essential for learning the capabilities of in-browser programs. For example, in-browser JavaScripts can be used to react to user action, store cookies and ask questions specific to a user, and so much more. Here is the link for this helpful Java Introduction.

I was looking to build a basic animation control code for an image slide bar that the user can interface with. I wanted the images to rotate only when an arrow bar is clicked. I also wanted to have reactive dots underneath the image slideshow in order to indicate which image the user is on. The following resource was used to better grasp the JavaScript function that I had to build. Studying this implementation helped me reaize that the different images were going to have to be stored in an array in my code. This would ultimately make it easy when incrementing a counter variable to pull the appropriate image from the array.  Here is the link for the Slide Show JavaScript Code.

 

Before trying to utilize my JavaScript functions, I needed to first learn how to call JavaScript functions and methods from the HTML file. This was key in order to actually use the JavaScript program. Here is a link that taught me alot about calling JavaScript functions.

 

Lastly, I used the following link to learn more about JavaScript's Style Display Property. I wanted to utilize this property in order to display the updated slideshow image whenever the user clicks a button. Ultimately, this tool can be used to alter the display characteristics of the images in the slideshow array of images. This was used to exclusively display the next image stored in the array. Here is the link for this page.

 

Kindest regards,

John Borg