Tuesday, 6 December 2016

(Year 3 Sem C) Week 4 Prototyping Preparation (Part 3)

Today, I also continue working on the prototype.



The problem is solved and adjusted by adding float function in CSS. After that,  I try to apply JavaScript to different interaction to the website but I have failed. Therefore, I decided to change it by using jQuery. But, I also failed to make the "Enter" button to make interaction.  In this moment, I decide to post out my problem to Stack Overflow. Here is some reply from Stack Overflow.


 The correct way to call out the function is using ("#Enterbutton") instead of using ("Enterbutton").

$(document).ready(function(){
 $("#Enterbutton").click(function(){   
        alert("The paragraph was clicked.");
});
});

Then, I have added the alert to confirm the paragraph is clicked.


$(document).ready(function(){
 $("#Enterbutton").click(function(){   
        //alert("The paragraph was clicked.");
 $("#Titlepage").fadeOut(1000);
 $("#Enterbutton").fadeOut(1000);
 //$("#Content").show();
 $("#Playbutton").fadeIn(1000);
 $("#Writebutton").fadeIn(1000);
 $("#Content").fadeIn(1000);
});
});

After that, I have added function such as fade in, fade out and show to apply more interaction to the website.
 


From now, the website can be clicked but not really fully interact and it is just a simple interaction like click and play. Therefore, I need to burst up my working process and work harder to the website.

No comments:

Post a Comment