Thursday, November 6, 2014

Ubuntu App: Clicking a div

I wasn't able to figure out the problem with my meanings app and I got kind of frustrated so I abandoned it for now and I tried to make my own small app. I decided to make a div that when pressed would add a class. I had one error about my maintainer name because I was unaware you had to put a certain name for that field but I fixed that not too long afterwards. I also had 2 warnings that I don't really know how to fix and I couldn't find a solution on the internet.

In my body I simply had a div that also started with a class
<div id="test" class="blink">TEST</div>

I just used two classes that were already provided, the div started with "blink" which I'm assuming would make the div fade in and out
.blink {
    animation:fade 3000ms infinite;
    -webkit-animation:fade 3000ms infinite;
}

and when clicked would have the class "is-hidden" which I'm also assuming just makes the div disappear
 .is-hidden {
    display: none;
}


My javascript was just a click function that would add the class "is-hidden"
$(document).ready(function() {
    $("#test").click(function() {
        $(this).addClass("is-hidden")
    });
});

1 comment:

  1. Screen shots are going to be a required part of your blogging for this project, since you are focusing on UI and the reader (me ;-) will want to see code together with the screen it generates.

    Please split off your blog from Finn's next week. There is no good reason to keep them together now, and it will be easier to read if they are apart.

    Here is an idea for a project:

    Create a screen that displays a question together with 4 answer choices the user could select (a multiple choice question). The only task now is to display the question and answer choices neatly on the screen. No backend processing at this stage.

    ReplyDelete