I looked in Internet but could not really found what I was looking for....
What is bothering me is why my code is not working with more than one prototype command in a onclick event!
| SitePoint Sponsor |
I looked in Internet but could not really found what I was looking for....
What is bothering me is why my code is not working with more than one prototype command in a onclick event!
Don't panic. There is a lot of stuff to think of, but the only way to do it is by being aware of it and take it step by step.Originally Posted by elisa05fr
I'll look into your issue and come back to you later.
Before asking, do a search... if you don't find the answer, then ask
The purpose of this forum is to help others in the community, that's why it's called Sitepoint and not Linkpoint.
SP Guidelines - No fluff.
Thinking Web: Voices of the Community - The Community Book
Thank you so much for your help!!!
Well, don't thank me so quickly. You have homework to do
Learn about what "semantic markup" means and how it will make your life easier.
Think about how you would markup this page differently... try to improve your HTML...
Before asking, do a search... if you don't find the answer, then ask
The purpose of this forum is to help others in the community, that's why it's called Sitepoint and not Linkpoint.
SP Guidelines - No fluff.
Thinking Web: Voices of the Community - The Community Book
I will start by the alternative to javascript
Then I will replace the getElementById (if you can help me find out what is the problem with 2 commands written on the onclick event!)
And then I will look in at how to improve my HTML
Lot a work!!!! but thank you for all the help....
I would like to use prototype.... but protptype uses JS right?... so what is the alternative to this? If js is switched off what am I supposed to do?
Thanks
Hello again,
I am getting rid of the javascript stuff.... but I was wondering is "javascript:void(0)" would have the same effect than "#" in the following code:
Actually I have replaced it byCode:<area href="javascript:void(0)" onclick = "$('fp').hide();document.getElementById('themes').style.display='block';document.getElementById('fadeThemes').style.display='block'" alt="Algunos de los temas que toca el grupo de jazz Café Paris" shape="poly" coords="54, 7, 75, 65, 108, 68, 101, 90, 16, 88, 15, 70, 45, 67">
and I cannot see any difference.....Code:<area href="#" onclick = "$('fp').hide();document.getElementById('themes').style.display='block';document.getElementById('fadeThemes').style.display='block'" alt="Algunos de los temas que toca el grupo de jazz Café Paris" shape="poly" coords="54, 7, 75, 65, 108, 68, 101, 90, 16, 88, 15, 70, 45, 67">
Please tell me if I am right! ( I suppose I am not but still!)
One more question.... I know that loading the photos take a hell of a lot of time... and it's not good.... you said that I needed Ajax.... I looked in Internet but could not find what I was looking for.... could you just show me in which direction I should be going?
For the moment, I only load the pictures in a table... and it is too long!
I am improving the site... and I will upload it soon.... I just want to solve some issues first...
The photos upload is the most important one!
I was thinking about minshowcase or thickbox... what do you think?
While I understand that you are in a hurry (I don't know if this is a paid job for you, or what kind of commitment you have but it is obviously important to you) I personally think that you are doing it all wrong.
Your HTML should be top-notch before going into programming. Then, your CSS should be of high level too. After you get those really under control, and only then, you start programming.
The reason is very simple. It reduces the number of errors in your programming and it makes it easier to maintain.
Right now, you know what you are doing and control your code, you remember even where the last dot is. But in 2-3 months after you are finished with this, you will remember nothing. If you need to update the site, you will spend hours just investigation what you did yourself.
Which is, basically, what I am doing right now and am trying to figure out.
We have very different styles of coding, and trying to understand someone else's code is hard work, believe me
Regarding AJAX, it is a mix of technologies ((X)HTML, CSS, javascript, DOM) and not just one thing. To put it very simple, is javascript with a xmlHttpRequest object. This object allows to load elements and pages even after the page has already been served.
If javascript is turned off, of course, it will not work. That's why you must have an alternative plan. All this (together with the gathering of information, concept design, decisions about which will be offered to the user, etc) is called the planification of the site, and it is preferably done before you code.
The best thing to do is to have a static, good old fashioned HTML site and add behaviour and effects with Javascript. In this way, the site will always work perfectly even if javascript is off. Of course, if it is on, the effects will give it a nicer look and better interaction. In programming, this technique is called Progressive Enhancement.
Before asking, do a search... if you don't find the answer, then ask
The purpose of this forum is to help others in the community, that's why it's called Sitepoint and not Linkpoint.
SP Guidelines - No fluff.
Thinking Web: Voices of the Community - The Community Book
Suggestion: Read Sitepoint's "The Javascript Anthology, 101 essential tips, tricks & hacks" by James Edwards and Cameron Adams. I think it will help you lots.
Before asking, do a search... if you don't find the answer, then ask
The purpose of this forum is to help others in the community, that's why it's called Sitepoint and not Linkpoint.
SP Guidelines - No fluff.
Thinking Web: Voices of the Community - The Community Book
Ideally, no code should be there at all. To be able to use a site and include javascript behaviour you should use Event listeners. But this is advanced Javascript. So first, make it work, then get rid of it in the page.
NOTE: JQuery and Prototype are two of the thousands javascript libraries that exit around the world.
The huge problem about javascript is not javascript itself, but the Document Object Model or DOM. The Document Object Model is a group of objects that the browser manunfacturer allows you to manipulate so that you can add functionality to your site with a programming language (that is, the browser holds all the information about the page rendered and the elements in it, as well as information about the screen size, color depth or some other data that may be of interest).
You can move and change your page on the fly because this manunfacturer allowed you to by giving you a way to access to that info (again, this is the DOM).
Different browsers are created by different manunfactures therefore they have different DOMs. Some browsers keeps the information under the Window object, other under the document object (do you remember your "document.getElementById"?)... To create a program that works in all browsers is what we call a cross-browser. It manages all the differences among browsers (not an easy task)
These javascript libraries are so popular because they handle this situation. They are cross-browser libraries.
As an example, thickbox is based on JQuery library. This means that it uses JQuery set of functions, instead of using javascript directly.
NOTE2: I think that I like minishowcase better
Before asking, do a search... if you don't find the answer, then ask
The purpose of this forum is to help others in the community, that's why it's called Sitepoint and not Linkpoint.
SP Guidelines - No fluff.
Thinking Web: Voices of the Community - The Community Book
Exactly, what do you mean by this?
Before asking, do a search... if you don't find the answer, then ask
The purpose of this forum is to help others in the community, that's why it's called Sitepoint and not Linkpoint.
SP Guidelines - No fluff.
Thinking Web: Voices of the Community - The Community Book
Thanks for your comments....
What I mean with the prototype stuff is that if I try to replace the show command (that uses javascript : ElementByIndex) with the prototype command $(field).show() it does not work!!!! It works well if I only replace the first command!!!!
HTML Code:<area href="javascript:void(0)" onclick = "hide('fp');show('photos');show('fadePhotos')" alt="Fotos jazz: amenización, cocteles, fiesta empresa, conc;ierto" shape="poly" coords="279, 19, 285, 38, 276, 56, 298, 60, 296, 78, 253, 79, 254, 60, 266, 53, 267, 39">
I am trying to get rid of the js stuff....
The reason is that you can only have one fucntion per element and event.
Before asking, do a search... if you don't find the answer, then ask
The purpose of this forum is to help others in the community, that's why it's called Sitepoint and not Linkpoint.
SP Guidelines - No fluff.
Thinking Web: Voices of the Community - The Community Book
SO, what can I do? I really would like to get ride of the getElementByIf stuff.... but I have three commands per event!!!! Could I replace the trhee commands by one js function calling the 3 prototype commands... but once again I am using JS!!!!
If everything works as expected, and only then, you have to use event listeners to get the code out of the way and place it in an external .js file.
Regarding the use of JS, you are always using JS... even if you are using a JS library.
Here is a good article about it, explaining the two methods used to do this (Microsoft has its own way to do things and uses attachEvent instead of addEventListener)
http://www.quirksmode.org/js/events_advanced.html
This other article, while brief, does give a good hint about why using event listeners
http://www.onlinetools.org/articles/.../chapter4.html
Last edited by molona; Jan 16, 2009 at 08:26.
Before asking, do a search... if you don't find the answer, then ask
The purpose of this forum is to help others in the community, that's why it's called Sitepoint and not Linkpoint.
SP Guidelines - No fluff.
Thinking Web: Voices of the Community - The Community Book
Thanks a lot... I will look into those links!
Posting Permissions
Bookmarks