Showing posts with label positioning. Show all posts
Showing posts with label positioning. Show all posts

Monday, March 17, 2014

Yeesh In A New Tab!

     Yeesh! This is sooo late! I did a lot of things today; it was crazy! I reeeaaalllyy wanted to say that I didn't feel good and that it's St. Patrick's day, but that was just an excuse, and those things suck when the next day shows up and you realize you didn't do what you were supposed to. Today, I'm working on a HTML/CSS project with Udemy.  It's actually pretty neat, you can make "websites" and use files on your computer to move around. Like, contact, home, and whatnot. Obviously, no coffee. It's almost 11pm... But, I've got Groovshark going, with the instructional videos cutting in every now and again. So, it's time to plug in and plug away!



HTML/CSS


     Yup, a website! The coolest things that I learned shall be brought forth into the light of your computer! First up is opening something in a new tab. I love it when a website opens something that I might just be checking out, but isn't a main feature, in a new tab. What you put is this:

<a target = "_blank">

  and that's it! It's super easy! And so freakin useful! Good thing I know about that now!    

 Next up is the redirect. If you want to show a warning, a statement, you don't want people to hang around, you use this! You set the time that the computer will wait, and then boom! Redirect!

 <meta http-equiv = "Refresh" content  = "12; url = http:www.bing.com"/>

 The number '12' refers to how long you want the client to wait before they go to the url.
     The next thing up is how to have a link go to a specific page on your website. Let's say you have a long article, and you want to be able to point out a certain area. Using this will open the link scrolled down to the area that you want them to see. You see this employed in FAQs and READMEs all the time.
     You give the section you want to go to with a tag like this: <a name = "example_name">

And then to call it, you use tags like this: <a href ="Example_page#example_name">Example</a>

Also, a good place to see a lot of other tags is to go here and just cruise around. It's w3; if you don't know what that is, look it up. Definitely worth knowing.

I just looked at the HTML version of this article. That was cray cray. Turns out it IS a good idea to do the html title thing in HTML because then you don't end up with a looott of completely unnecessary spans and divs. Anyhoo, back to the subject at... mouse? Not too sure what to call it when it's online.
The only thing left is: the different ways to call CSS, because; there's more than one way to do that! crazy, right? But, instead of me telling you, I'll let this guy do a better job than I could!

SO! That's going to do it for today, folks. I know, no .js. But never fear! I shall have some! At some point. I'm working with the HTML right now, but the class will be bringing in .js and PHP and some other cool stuff, so don't go crazy. I'll have some when I get some. See y'all on Wednesday!


--Martin

Wednesday, February 26, 2014

I Finished the course!/.js is still a-happening.

     I already know that this is late because I'm writing the intro last. What, I can do that. It's called mixing things up. I do that sometimes. The good news is that I finished the HTML/CSS lesson! OlĂ©! The boring news is that I still have a ways to go with the .js. Not really sure that's boring since that just means I'll be learning a lot more new things. Learning new things is always fun. So, I take the back the boring other news is that .js is still going on.  Ye olde(See, I did it again!) grooveShark is still blazing away. No coffee today. Just pure gumption over here! Time to plug in and plug away!

HTML/CSS


     Working away ye olde(I say ye olde too much) HTML/CSS again. Remember that website about an angry puppy from a while back? right around when I started CSS. They had me build it now. Which was weird, because; I knew what they were talking about! Whaaaaat?? That is just weird. The play on words was delightful. I'm working on positioning(still) and I am using it to make a "resumĂ©" and they said how to "position" yourself. I laughed. Good grammar and a funny play on words is always delightful. Today was review. Lots of review.
     And now I know why! I'm done the lesson! Good thing I've got plenty of classes elsewhere that use HTML.


JavaScript


     First up are the notations. I've already gone over them, but today's theme seems to be review.
First there is Literal notation. "Literal notation creates a single object. It uses curly brackets { } and the object's default properties are defined within the brackets using <property:value> notation.
I find this to be the quickest when it applied to a small number of elements.

     Second is the Construction notation. "Constructor notation involves defining an object constructor. And like defining a function, we use the function keyword. You can think of this constructor as a "template" from which you can create multiple objects. To create a new object from a constructor, we use the new keyword."
I use this one when you have multiple elements with same properties.  For example:
//this one is the Construction notation.
var james = {
    job : "programmer",
    married : false
 
};
//This one is the Literal notation.
function Person(job, married) {
    this.job = job;
    this.married = married;
}

var gabby = new Person("student",true);

     See how many lines of code are needed in a Construction notation for one Object?
The Literal notation has more lines of code up front, but then you're able to add more in one line later on. The Construction notation has its uses, but, usually, in a more singular case. I say usually, because; everyone has their own way of doing things, and I'm sure that for some people, the Construction notation is their go-to trigger. My go-to trigger is my laptop. I found my old laptop, which means that I might be talking about a game soon. It's running ElementaryOS. I think I'll try and get Sublime Text or something along those lines and take a crack at it. That's all for today, folks! See y'all Friday!

--Martin

Monday, February 24, 2014

500, What?/Nothing Of Importance.

     It's Monday. Again. It keeps happening, man! No matter what I do, there's Monday! No-one gets away from Monday. I've had my coffee, but I'm still exhausted! I can barely keep my eyes open! I'll try to get this thing going quickly. Sound City is playing from G music. "From Can To Can't" is my favorite song in the album. Now, time to plug in and plug away!


HTML/CSS




      It seems that I've done 500 lessons! That's nifty. The lesson says I'm about 70% complete with HTML/CSS. Again, that's nifty. Really, I need to find out how to make a game with my new-found powers. Right now I'm working on positioning. Working with Margin, Padding, Border, and Content; you get abbreviations like 'TP' 'TM' 'TB' The 'T' stands for 'Top' the other are: 'Padding', 'Margin', and 'Border' respectably. I've already worked with margin somewhat, you have: auto, but you can also do something like:

div { 'margin-top: 5px; margin-right: 10px; margin-bottom: 5px; margin-left: 10px;}

Or, you can do:

div{margin:5px 10px 5px 10px;}

it's the same thing. You would use the first example when you're trying to specify less than all of the aspects of a tag's properties. Maybe just the left and the right, or something similar.
      You also have the same thing with Padding. You can also use negative positioning. Such as: div{margin-left:-20px;} instead of moving the object twenty pixel's worth to the right from the closest border, it would move it 20 pixels closer. Maybe even past it.
      Then there's float. You can move that left or right. Unfortunately, sometimes large floating elements get mixed with non-floating ones, and elements do end up on top of each other. To combat this, you use <clear> you can clear left, right, or both.
      If you don't specify an element's positioning type, it defaults to static. This is when you use <position>. You have absolute, which means that it's going to stay the same distance from its first parent element it has that doesn't have position: static. If there's no such element, the element with position: absolute gets positioned relative to <html>.
      Relative is another term, but also more straightforward: it tells the element to move relative to where it would have landed if it just had the default static positioning.
      Finally, we come to fixed positioning. Fixed anchors an element to the browser window; you can think of it as gluing the element to the screen. If you scroll up and down, the fixed element stays put even as other elements scroll past. Hipster websites loved that trick for while there.


JavaScript




      Nothing of importance to report on this one. I'm working away, but it's just reinforcement. I'll have more on Wednesday. See y'all then!

--Martin