Post by: chimera15 on Thu, 02 September 2010, 11:05:24
20 years later I'm trying my hand at javascript since it's integral to creating dynamic web pages that are actually considered web pages. I'm not horrible at flash but given the recent turn of events where everyone hates flash I figured I'd be good to learn more traditional and accepted methods.
Anyway I'm having a horrible time. My current assignment is simply to display a graphic and have it move across the screen from left to right utilizing css, to position it, then use a onload and timer functions. I haven't got a clue. The book is no help, and I don't really want to go begging the professor and let him know what an idiot I am as far as programming goes. Everything I've tried has been disaster.
Anyway, any javascript gurus on this board that could maybe point me in the right direction?
Post by: Superfluous Parentheses on Thu, 02 September 2010, 11:46:59
I'm sorry to say that pretty much all JavaScript books suck. The only ones I'd recommend are: Flannagan (http://www.amazon.com/JavaScript-Definitive-Guide-David-Flanagan/dp/0596101996/ref=dp_ob_title_bk/178-1141996-4508037) (which is at least a good reference book on how to do browser programming, even if the description of the language itself is far from perfect), and possibly Crockford (http://www.amazon.com/JavaScript-Good-Parts-Douglas-Crockford/dp/0596517742/ref=sr_1_1?s=books&ie=UTF8&qid=1283445753&sr=1-1), which is all about the language itself, and is just about the only book that deals with the language correctly.
You need only the first book, but the second one might give you a much better understanding of the JavaScript language than anything else you will find in paper or online.
PS: If your course books and assignments aren't working for you, DO TELL THE INSTRUCTOR. You may not be the only one who's having problems. FWIW, going from "no programming and HTML knowledge" to "move stuff around on the page without using any kind of libraries" is not trivial.
Post by: instantkamera on Thu, 02 September 2010, 12:13:54
Quote from: Superfluous Parentheses;219177
I'm not sure what parts you're having difficulty with. Do you know how to position things using CSS? Do you have any kind of working knowledge of the JavaScript language?
I'm sorry to say that pretty much all JavaScript books suck. The only ones I'd recommend are: Flannagan (http://www.amazon.com/JavaScript-Definitive-Guide-David-Flanagan/dp/0596101996/ref=dp_ob_title_bk/178-1141996-4508037) (which is at least a good reference book on how to do browser programming, even if the description of the language itself is far from perfect), and possibly Crockford (http://www.amazon.com/JavaScript-Good-Parts-Douglas-Crockford/dp/0596517742/ref=sr_1_1?s=books&ie=UTF8&qid=1283445753&sr=1-1), which is all about the language itself, and is just about the only book that deals with the language correctly.
You need only the first book, but the second one might give you a much better understanding of the JavaScript language than anything else you will find in paper or online.
PS: If your course books and assignments aren't working for you, DO TELL THE INSTRUCTOR. You may not be the only one who's having problems. FWIW, going from "no programming and HTML knowledge" to "move stuff around on the page without using any kind of libraries" is not trivial.
agree 100%. Plus, speaking with the class instructor is at least as easy as asking a keyboard enthusiast group for help ...
Post by: microsoft windows on Thu, 02 September 2010, 12:22:15
Post by: Shawn Stanford on Thu, 02 September 2010, 13:04:04
Every O'Reilly book I've used was excellent, and I have several - including an older version of the JavaScript book. There was another book that was really good, but I don't remember the title. I'll look for it when I get home. It had lots of nice, stealable code. Finally, I used the site 'WebMonkey.com' for a lot of hints and tips.
Post by: chimera15 on Thu, 02 September 2010, 13:06:32
http://www.webreference.com/programming/javascript/java_anim/2.html (http://www.webreference.com/programming/javascript/java_anim/2.html)
And also this tutorial:
http://www.c-point.com/javascript_tutorial/MMTutorial/lMoveImage.htm
(http://www.c-point.com/javascript_tutorial/MMTutorial/lMoveImage.htm)
Which is very close to the assignment.
But the problem is the css. I get how the css assigns a name to the picture in that code, but it doesn't look like css I've ever seen before, and as far as I know doesn't use div's so I couldn't assign it to a stylesheet.
The code there is this:
height=auto;
width=auto;
align=baseline;
src="ani_cat.gif">
I tried to change it to something more like this:
![]("ani_cat.gif"/)
This worked to display the image, but it broke the animation.
I don't get why.
Post by: Superfluous Parentheses on Thu, 02 September 2010, 13:32:19
Quote from: chimera15;219216
But the problem is the css. I get how the css assigns a name to the picture in that code, but it doesn't look like css I've ever seen before, and as far as I know doesn't use div's so I couldn't assign it to a stylesheet.Stylesheets/CSS can only assign values to the style of an element. You can't set things like ID or CLASS attributes using CSS. Where it gets confusing is that, for mostly historical reasons, some elements have attributes that are pretty much equivalent to styles (IMG has width and height attributes, for example, but with and height are also style attributes).
The code there is this:style=" left: 0px; position: absolute; top: 50px"
height=auto;
width=auto;
align=baseline;
src="ani_cat.gif">
I tried to change it to something more like this:
This worked to display the image, but it broke the animation.
I don't get why.
Some other observations:
You don't need a DIV to style any element, CSS can style pretty much anything (the exception being form widgets which are usually restricted from styling in some ways). If you have an IMG or DIV or P or H3 or whatever with an ID attribute, you can style it using the CSS:
TEXT
#id-of-element {
style-attribute: value;
another-style-attribute: value2;
}
If you want to style a group of elements, you generally want to target the CLASS attribute (IDs must be unique, classes are designed to be used on multiple elements):
TEXT
.class-of-element {
border: 1px solid black; /* for example */
}
The idea behind IDs and CLASSes is to let scripts and style sheets target the HTML elements. There would be no point to setting IDs and CLASSes using CSS even if you could.
If you want to style all elements of some type (IMG, H3, whatever) you can do that too:
h3 {
border: 2px solid red;
background-color: blue;
}
Note the # and . preceding ids and classes in the CSS.
Last note: in CSS you NEVER use an = sign. Style attributes are assigned using name: value (not name= value). You should also pay close attention to the exact position of quote marks and other delimiters, or it'll just not work.
I recommend you use firefox with the firebug extension installed and enabled. Also, switching on Firefox's error console should give you decent feedback about any javascript, css and html errors you might be making.
PS: if you want to animate anything, the "position: absolute" style attribute is essential, so leave it in the stylesheet or the HTML. Throw out the "float: $whatever". Position and Float are conflicting attributes. Read up on those attributes if you're interested later.
Post by: instantkamera on Thu, 02 September 2010, 13:45:19
Quote from: chimera15;219216
I found this website:
it doesn't look like css I've ever seen before
The code there is this:style= left: 0px; position: absolute; top: 50px"
height=auto;
width=auto;
align=baseline;
src="ani_cat.gif">
The part in bold is inline css, the rest are just regular html attributes that happen to also be controllable via css.
I tried to change it to something more like this:
[QUOTE="chimera15;219216]
This worked to display the image, but it broke the animation.
I don't get why.[/QUOTE]
the line in bold is an issue. you copied the html "style" attribute, it is un-necessary here as stand-alone CSS is ALL ABOUT style (as the name implies). Also, as SP mentioned, you cant assign the ID using CSS.
Post by: instantkamera on Thu, 02 September 2010, 14:35:47
Quote from: Shawn Stanford;219214
I wrote a good amount of fairly complex JS a few years ago, but I haven't touched it in a while.
Every O'Reilly book I've used was excellent, and I have several - including an older version of the JavaScript book. There was another book that was really good, but I don't remember the title. I'll look for it when I get home. It had lots of nice, stealable code. Finally, I used the site 'WebMonkey.com' for a lot of hints and tips.
that reminds me of:
(http://i.imgur.com/RzRcw.jpg )
there's a really funny one of them stacked up so you can really see the difference in thickness, but I couldn't find it ... hilar.
Post by: Superfluous Parentheses on Thu, 02 September 2010, 14:55:15
Quote from: instantkamera;219256
there's a really funny one of them stacked up so you can really see the difference in thickness, but I couldn't find it ... hilar.
:D I actually recommended both up thread.
But note that "JavaScript the definitive guide" is actually much more about browser stuff than JavaScript. JavaScript is fairly simple. Browsers are complex. The problem is that most JavaScript books just skip over the JavaScript part and go straight to the browser stuff, which explains a lot of the really awful JS code you find everywhere. "JavaScript, the good parts" is really a reaction to that, and IMHO required reading for anyone "doing" JavaScript professionally - especially if they haven't used a dozen other languages.
Post by: chimera15 on Thu, 02 September 2010, 17:29:01
Quote from: instantkamera;219228
The part in bold is inline css, the rest are just regular html attributes that happen to also be controllable via css.
I tried to change it to something more like this:
the line in bold is an issue. you copied the html "style" attribute, it is un-necessary here as stand-alone CSS is ALL ABOUT style (as the name implies). Also, as SP mentioned, you cant assign the ID using CSS.
Oh alright, so only style=" left: 0px; position: absolute; top: 50px" is the css in this? The rest is html?? hmm...
It's been a year since I learned css, and forgotten most of it, but it doesn't look like normal css I'm used to seeing at all.
You have to assign the name of the image in html, so you can use the javascript function on it?
Alright I think I see it a little better now, it's more like:
position: absolute;
top: 50px"
height=auto;
width=auto;
align=baseline;
src="ani_cat.gif">
Why isn't there a ; after the img id though.... Oh well it didn't indent like I wanted it to.
Post by: Superfluous Parentheses on Thu, 02 September 2010, 17:34:19
Quote from: chimera15;219315
Oh alright, so only style=" left: 0px; position: absolute; top: 50px" is the css in this? The rest is html?? hmm...Yeah. the style="bla bla bla" stuff in the HTML is just a way to provide "inline" styles, and has the same syntax as CSS.
Quote
It's been a year since I learned css, and forgotten most of it, but it doesn't look like normal css I'm used to seeing at all.Looks normal to me :)
Quote
You have to assign the name of the image in html, so you can use the javascript function on it?It's easiest to assign an id or a class. Names are IIRC only valid for form widgets and links, not "normal" HTML elements, and in any case, names are harder to address. You can use other more advanced constructs, but in this case, I'd go for a plain ID, since you're only interested in moving and styling one specific item, and addressing things by id is the easiest and most portable method of accessing/modifying stuff in JavaScript (via the getElementById() method).
Post by: pfink on Thu, 02 September 2010, 18:48:30
http://www.soybomb.com/ratpfink/javascript/
Post by: microsoft windows on Thu, 02 September 2010, 19:38:29
(http://ecx.images-amazon.com/images/I/51HxKfcxHcL._SL500_AA300_.jpg)
And mine's still new in the plastic wrap!
Post by: Shawn Stanford on Thu, 02 September 2010, 20:05:34
(http://ecx.images-amazon.com/images/I/51V5Z6NPNQL._SL500_AA300_.jpg) (http://naugatuck.ct.nsh.schoolinsites.com/)
Post by: microsoft windows on Thu, 02 September 2010, 20:15:40
Post by: Superfluous Parentheses on Thu, 02 September 2010, 20:19:14
Quote from: microsoft windows;219368
Ooh! Is it compatible with Windows 98?
Color scheme certainly indicates '95 or '98.
Post by: pfink on Thu, 02 September 2010, 20:22:44
Quote from: microsoft windows;219357
I was looking through my software and found the perfect JavaScript program for EIBM--It's from the 90's and it's IBM branded!Show Image(http://ecx.images-amazon.com/images/I/51HxKfcxHcL._SL500_AA300_.jpg)
And mine's still new in the plastic wrap!
Java != JavaScript
Post by: EverythingIBM on Fri, 03 September 2010, 02:28:57
Quote from: microsoft windows;219357
I was looking through my software and found the perfect JavaScript program for EIBM--It's from the 90's and it's IBM branded!Show Image(http://ecx.images-amazon.com/images/I/51HxKfcxHcL._SL500_AA300_.jpg)
And mine's still new in the plastic wrap!
I find it amazing at how much old software you have brand new still shrinkwrapped.
If you don't have any use for it, I'd consider getting that off of you in the future... it would be funny to show my friend who's studying Java script.
Post by: instantkamera on Fri, 03 September 2010, 06:09:03
Quote from: microsoft windows;219357
I was looking through my software and found the perfect JavaScript program for EIBM--It's from the 90's and it's IBM branded!Show Image(http://ecx.images-amazon.com/images/I/51HxKfcxHcL._SL500_AA300_.jpg)
And mine's still new in the plastic wrap!
uggggh. :doh:
Quote from: pfink;219371
Java != JavaScript
YES, THANK YOU!
Post by: Findecanor on Fri, 03 September 2010, 06:55:18
* JSON is simple, effective and very dirty: Use XML.
* Business logic and security concerns should be handled on the server, not in Javascript in the browser. Don't send more stuff in objects between client and server than what is absolutely necessary.
* Learn how objects work in Javascript. Javascript is a "prototype-based" object-oriented language, and thinking in classes does not always work.
Post by: EverythingIBM on Fri, 03 September 2010, 07:10:32
Quote from: instantkamera;219477
uggggh. :doh:
YES, THANK YOU!
You don't have to get your diaper in a tangle over a simple mistake:
(http://media.ebaumsworld.com/2006/07/diaper.jpg)
Post by: Konrad on Fri, 03 September 2010, 07:11:36
Quote from: chimera15
... I'm not horrible at flash but given the recent turn of events where everyone hates flash I figured I'd be good to learn more traditional and accepted methods.Flash haters?
Flash is good. Flash makes things blink and zing and animate and adds interest and sheer excitement to each and every web visit. Some flash gimmicks are entertaining or original enough to make me pause and waste time just hovering across menu bars (making me briefly forget the content I was supposed to find). Maybe that's perfectly normal, or maybe I have mental problems (caused by years of studying things like Java, ahem).
But there is a darkside to flash. Like those bloaty video placeholders which take up half a screen slowly loading some needlessly hi-res video that won't do anything more than a static menu and some product photos could do better. Forcing the visitor to view lengthy presentations (probably about something else he isn't actually looking for, like google ads on youtube) is just not good. Animations which take a little time to play out without allowing the user to speed through to the content he wants are bad. Page layouts which play animations across dozens of tiny animated hover zones are very annoying when the visitor is trying to scroll through lists or click on something he sees at the faraway side of the screen. Anything which denies the visitor full use (and full speed) of his mouse/cursor control is simply begging for trouble. Any flash which forces the user to patiently wait in front of the door (even for a couple seconds) will cause many people to simply walk away and take their browsing elsewhere. And I'm talking broadband here ... how those poor 56K bastards survive on the internet is beyond me, but it can't hurt to help them limp along with lightweight pages that use flash in a sparing and smart manner. As in all things, small code runs faster. And the more potential security alarms your site triggers (ranging from harmless cookies to expired certificates to linking into external or ActiveX flash players), the more people with paranoid browser settings will be wary of remaining. The internet is a virtual land of limitless opportunity, people won't stay anywhere that annoys them because it takes only a moment to find another destination. It's all about speed; flash animation delays can be avoided, flash downloading times can be minimized. Don't be stupid and force visitors to automatically listen to songs or watch videos when they might be searching for something else. Usually something else very specific, because they found the link to your page on a search engine.
Avoid being seduced by the perils of the darkside and flash will be your ally. Once down the path of bloaty flash you begin, forever will it consume your site's destiny.
Post by: instantkamera on Fri, 03 September 2010, 07:28:39
Quote from: EverythingIBM;219487
You don't have to get your diaper in a tangle over a simple mistake:Show Image(http://media.ebaumsworld.com/2006/07/diaper.jpg)
That diaper is clearly not tangled.
Post by: Konrad on Fri, 03 September 2010, 07:42:07
Post by: Findecanor on Fri, 03 September 2010, 09:21:22
However, the biggest gripe I have, as a user, is that the browser's "Back" button does not work in Flash. Too many times, I have navigated deeply into a site which has felt like any other HTML-based site and clicked "Back", only to find myself somewhere else completely.
Post by: itlnstln on Fri, 03 September 2010, 09:23:41
Quote from: EverythingIBM;219487
You don't have to get your diaper in a tangle over a simple mistake:Show Image(http://media.ebaumsworld.com/2006/07/diaper.jpg)
Yo, dawg, you might not want to share personal photos.
Post by: chimera15 on Fri, 03 September 2010, 09:55:44
Quote from: pfink;219335
Here ya go:
http://www.soybomb.com/ratpfink/javascript/
Oh wow that's amazing!!! Wow thanks so much. That uses a css and style that looks much more familiar. I'll have to ask you some questions about this when I try to redo it later today.
Post by: chimera15 on Fri, 03 September 2010, 09:57:15
Quote from: microsoft windows;219357
I was looking through my software and found the perfect JavaScript program for EIBM--It's from the 90's and it's IBM branded!Show Image(http://ecx.images-amazon.com/images/I/51HxKfcxHcL._SL500_AA300_.jpg)
And mine's still new in the plastic wrap!
That's Java not Javascript. They named them alike to confuse people, but they're two different things, although they look alike as well cause they're both based on C. lol
Edit:
Already stated I guess. I just learned this myself in this class. I always thought they were the same as well. I always wondered why somethings required me to install a runtime environment, while others worked perfectly on a machine in a browser with nothing installed at all. lol I guess now I know.
Post by: chimera15 on Fri, 03 September 2010, 10:01:12
Quote from: Konrad;219488
Flash haters?
Flash is good. Flash makes things blink and zing and animate and adds interest and sheer excitement to each and every web visit. Some flash gimmicks are entertaining or original enough to make me pause and waste time just hovering across menu bars (making me briefly forget the content I was supposed to find). Maybe that's perfectly normal, or maybe I have mental problems (caused by years of studying things like Java, ahem).
But there is a darkside to flash. Like those bloaty video placeholders which take up half a screen slowly loading some needlessly hi-res video that won't do anything more than a static menu and some product photos could do better. Forcing the visitor to view lengthy presentations (probably about something else he isn't actually looking for, like google ads on youtube) is just not good. Animations which take a little time to play out without allowing the user to speed through to the content he wants are bad. Page layouts which play animations across dozens of tiny animated hover zones are very annoying when the visitor is trying to scroll through lists or click on something he sees at the faraway side of the screen. Anything which denies the visitor full use (and full speed) of his mouse/cursor control is simply begging for trouble. Any flash which forces the user to patiently wait in front of the door (even for a couple seconds) will cause many people to simply walk away and take their browsing elsewhere. And I'm talking broadband here ... how those poor 56K bastards survive on the internet is beyond me, but it can't hurt to help them limp along with lightweight pages that use flash in a sparing and smart manner. As in all things, small code runs faster. And the more potential security alarms your site triggers (ranging from harmless cookies to expired certificates to linking into external or ActiveX flash players), the more people with paranoid browser settings will be wary of remaining. The internet is a virtual land of limitless opportunity, people won't stay anywhere that annoys them because it takes only a moment to find another destination. It's all about speed; flash animation delays can be avoided, flash downloading times can be minimized. Don't be stupid and force visitors to automatically listen to songs or watch videos when they might be searching for something else. Usually something else very specific, because they found the link to your page on a search engine.
Avoid being seduced by the perils of the darkside and flash will be your ally. Once down the path of bloaty flash you begin, forever will it consume your site's destiny.
I know, but there are a ton of flash haters. I love flash. Unfortunately this has spread to even Apple, and I can't access my current website that I built with a flash menu on their devices. So I'm going to try rework it with javascript. That assuming that I can understand even an iota of it.
Post by: pfink on Fri, 03 September 2010, 10:09:58
Quote from: chimera15;219537
Oh wow that's amazing!!! Wow thanks so much. That uses a css and style that looks much more familiar. I'll have to ask you some questions about this when I try to redo it later today.
No problem. It's basically just doing an infinite recursion and moving the object 1 pixel to the right every 20 milliseconds.
As an exercise you can try modifying it so that it wraps back around or stops when it hits the right side of the screen.
Post by: instantkamera on Fri, 03 September 2010, 10:13:12
so much about that vid seems wrong.
Post by: itlnstln on Fri, 03 September 2010, 10:59:38
Post by: chimera15 on Fri, 03 September 2010, 18:15:03
Quote from: ripster;219543
A life without Flash is a dull life indeed.
My flash is flashier.
Post by: ricercar on Fri, 03 September 2010, 23:14:23
(http://ecx.images-amazon.com/images/I/51V5Z6NPNQL._SL500_AA300_.jpg)
Peachpit "visual quickstart" books rock.
Post by: Konrad on Sat, 04 September 2010, 00:39:25
Once you know "enough" you just graduate to the interweb. Not just the sites which show java code you can steal, but also to sites that use nice java code you can steal.
Post by: EverythingIBM on Sat, 04 September 2010, 20:32:44
Quote from: itlnstln;219526
Yo, dawg, you might not want to share personal photos.
So this is how you treat your GF?
(http://media.moddb.com/images/members/1/238/237092/LuigiNoLikePasta.JPG)
And here's a luigi-lego-head.
(http://www.pimpmynintendo.com/images/lego-luigi.jpg)
Uh oh, Ripster is going to get some serious envy.
(http://geekhack.org/attachment.php?attachmentid=12373&stc=1&d=1283650682)
Post by: chimera15 on Sat, 04 September 2010, 21:52:22
Post by: chimera15 on Wed, 08 September 2010, 21:09:24
I looked all over the web and found people with similar problems, but no solutions. Can't find anything in the book.
Post by: pfink on Sat, 11 September 2010, 15:21:53
Quote from: chimera15;221107
Next problem. We're doing forms. I have a form that gets passed to email, simply. It doesn't use a form engine, it just opens an email agent on the user's computer. The task is to put the day's current date in the body of the email automatically. I can figure out how to get the date in javascript, but not how to pass that variable to the body of the email. If I put the javascript in the body of a text field or something, obviously the scripting won't work, and just the scripting won't pass the value by being there.
I looked all over the web and found people with similar problems, but no solutions. Can't find anything in the book.
Something like this?
http://www.soybomb.com/ratpfink/javascript/SendEmail.htm
Post by: keyb_gr on Sat, 11 September 2010, 16:42:04
Coming back to the first problem, unfortunately I'm not aware of any other CSS intro that would be as nicely structured and "bottom-up" as Michael Jendryschik's German-language one. Understanding how CSS "ticks" is important, including the various kinds of selectors and the box model. Unsurprisingly, browser support for more advanced stuff still is a mess (if a lot more useful than it was years ago), but we've got lists (http://www.quirksmode.org/css/contents.html) for that.
Post by: JBert on Sun, 12 September 2010, 07:34:21
Quote from: keyb_gr;222104
That should be one of these "mailto: link with extra arguments" things. AFAIK this is not standardized but enjoys fairly wide support nonetheless.Waaah? There is an RFC for that, namely RFC2368 - The mailto URL scheme (http://www.faqs.org/rfcs/rfc2368.html). I would recommend reading it, it might be dry material but it is after all the reference.
Post by: chimera15 on Fri, 17 September 2010, 01:18:06
Next problem I think I really need help.
We're basically supposed to build a simulation of an oscilloscope, with 3 variables that will define the speed. We're supposed to create a diamond, that will have amplitude, speed, and oscillation per second data.... and apparently draw a line. Really up the creek on this one.
I mean where did this come from? It's crazy I think. Sometimes I think this course is there just to fail me. lol
Post by: timw4mail on Fri, 17 September 2010, 07:41:47
Quote from: chimera15;219541
I know, but there are a ton of flash haters. I love flash. Unfortunately this has spread to even Apple, and I can't access my current website that I built with a flash menu on their devices. So I'm going to try rework it with javascript. That assuming that I can understand even an iota of it.
It's people like you who give flash a bad name. Never use flash for essential things like navigation!
Post by: keyboardlover on Fri, 17 September 2010, 07:45:30
Quote from: timw4mail;224129
It's people like you who give flash a bad name. Never use flash for essential things like navigation!
Ugh...just use PHP!!
Post by: chimera15 on Fri, 17 September 2010, 08:24:38
Quote from: timw4mail;224129
It's people like you who give flash a bad name. Never use flash for essential things like navigation!
I already had this argument on this board. It's one of the reasons decided to change it.
It's a shame, it's a beautiful flash menu that interfaces great with html. Made absolutely beautifully in actionscript. The point of me using it was that allowed me to use flashy animation on the permanent parts of my website and still use html/css for updateable/easily changed parts.
It's no different from any website that uses flash as a main app, only you can actually see html on my page as well. I could have just put in backup html as another solution, or something but it would have added clutter. So my goal is to create a javascript menu, then a javascript function that detects if they have flash installed and will switch between the two menus.
My goal is to create really interactive and mind blowing websites, and that's really impossible as a single person at least without using flash. Even javascript it would take me months to write anything that comes close to something I can polish off in flash in less than a week, and never be anywhere near as cool looking.
Besides as this javascript class is apparently proving, I don't really have the math/programming skills to code some amazing website using javascript.
I don't really want to get in another flame war about this.
Post by: chimera15 on Fri, 17 September 2010, 08:32:24
Quote from: keyboardlover;224130
Ugh...just use PHP!!
php and javascript don't really have the same dynamic look and potential as the flash menu I was using.
I'm actually looking at some javascript libraries and some of them can make some pretty nice looking menus though. I've never used a javascript library though so not exactly sure what it will entail, but I have to say my eyes have been opened a little toward using more compatible means.
Currently I'm really stuck on this assignment though, and I need to get it done cause I have to get to classwork in my other classes.
I decided it's not really asking you to draw an oscilloscope, but to merely move a css object across the screen in the path of a sine wave, since javascript doesn't really have a native way to draw something like that. So similar to that other one I was having trouble with. I hope that's what it means at least. I'm having a horrible time just doing that as well. Some of these assignments are really cryptic.
Post by: timw4mail on Fri, 17 September 2010, 08:56:42
Quote from: chimera15;224135
php and javascript don't really have the same dynamic look and potential as the flash menu I was using.
I'm actually looking at some javascript libraries and some of them can make some pretty nice looking menus though. I've never used a javascript library though so not exactly sure what it will entail, but I have to say my eyes have been opened a little toward using more compatible means.
Currently I'm really stuck on this assignment though, and I need to get it done cause I have to get to classwork in my other classes.
I decided it's not really asking you to draw an oscilloscope, but to merely move a css object across the screen in the path of a sine wave, since javascript doesn't really have a native way to draw something like that. So similar to that other one I was having trouble with. I hope that's what it means at least. I'm having a horrible time just doing that as well. Some of these assignments are really cryptic.
My site uses CSS-only dropdown menus. To be honest, such "dynamic" menus that require flash are more of an annoyance than they are cool. As a user, I don't care about your fancy menu, I just want to be able to use the website. (Not that I haven't been guilty of similar things myself (Although not regarding flash)).
Post by: chimera15 on Fri, 17 September 2010, 09:03:17
Quote from: timw4mail;224139
My site uses CSS-only dropdown menus. To be honest, such "dynamic" menus that require flash are more of an annoyance than they are cool. As a user, I don't care about your fancy menu, I just want to be able to use the website. (Not that I haven't been guilty of similar things myself (Although not regarding flash)).
Since the site is question is a portfolio site, I really want to show what I can do. The website itself is the point of using the website at all basically, it's not like it's a search engine, or government site that has content that is the primary point and function is the ultimate goal. It's supposed to show all the bells and whistles I'm capable of producing, not to mention double as a design portfolio since that's one of the jobs I potentially want to get as well.
The first site I built uses a javascript/css menu(or really about the 5th incarnation of it), but it's pretty lax and I've had people tell me it looks unprofessional, even though it's pretty business like, and more straight forward as you've described.
So that's what I'm going for with this new site, a professional looking high quality design.
I also think you can use flash and have nice design and still be as intuitive to the user, if not more than a traditionally built site. That's what good design is all about really, being functional and yet still having pleasing form.
Some flash sites are what really inspired me to try to get back into web design and get a degree to try and pursue it professionally. Now that flash is on the out and I've gotten all this negative feedback about trying to do stuff in flash, it's pretty sad. I don't know.
Post by: chimera15 on Fri, 17 September 2010, 09:29:42
So how do I make the thing just follow a sin wave with 3 standard variables? I need to prun it down big time.
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
Post by: pfink on Fri, 17 September 2010, 13:28:55
Quote from: chimera15;224135
I decided it's not really asking you to draw an oscilloscope, but to merely move a css object across the screen in the path of a sine wave, since javascript doesn't really have a native way to draw something like that. So similar to that other one I was having trouble with. I hope that's what it means at least. I'm having a horrible time just doing that as well. Some of these assignments are really cryptic.
This site's got an example:
http://quantblog.wordpress.com/2010/05/26/animated-sine-wave-in-javascript-html5/
Post by: chimera15 on Fri, 17 September 2010, 15:32:55
Quote from: pfink;224204
This site's got an example:
http://quantblog.wordpress.com/2010/05/26/animated-sine-wave-in-javascript-html5/
That uses a library. I think that's beyond the scope of what this problem is asking.
Post by: chimera15 on Fri, 17 September 2010, 17:54:29
http://arc.id.au/JsAnimation.html
In particular this one gives the math I think I need to use:
http://www.motionscript.com/mastering-expressions/simulation-basics-1.html (http://www.motionscript.com/mastering-expressions/simulation-basics-1.html)
veloc = 40; //horizontal velocity (pixels per second)
amp = 12; //sine wave amplitude (pixels)
freq = 2.4; //oscillations per second
x = time*veloc;
y = amp*time*Math.sin(freq*time*2*Math.PI) + thisComp.height/2;
[x,y]
But I'm having trouble plugging that into my animation that I did and you helped with that first week.
Post by: chimera15 on Fri, 17 September 2010, 19:17:51
http://158.132.148.166/DynamicDuo/dynduo/en/geometric-sinewave.html
Looks like that one uses some strange library too...
Post by: keyboardlover on Fri, 17 September 2010, 22:15:03
I'm not sure if it's a requirement that you do this in pure javascript (without a library) but if not, it would behoove you to use jquery (http://jquery.com/). It will save you time and headaches.
HTH
Post by: chimera15 on Fri, 17 September 2010, 22:46:41