We Keep Coding

Removing Preload Div and JS breaks website

I created a site with a preloader and when I was done decided I no longer want it, but when I remove the code for it, it won't load past it any longer. It just displays a grey box when attempting to access the website.
There's quite a lot of code to show, but I was just hoping someone may be able to steer me in the right direction by telling me what Div is causing this via inspect element.
If there's any snippets of code I can provide please let me know.

The #main id on the upper most div is causing the problem. Consider using semantic elements like main over generic divs.

jQuery Image loads to fast for Animation

i made a little Page were you can change text/image on click. My Problem is that the image is loaded to fast. It should load after the TV disappeared. Maybe it helps to unterstand my problem. Just click "test 2".

This should be just a comment but I don't have enough reputation to do it. Sorry.
Don't know how you implement your animation and the source code is hard to read. If your problem is that while the first TV moves up and before it disappears, the picture has already become the second one, I think you could just add a callback function triggered by the end of transition. Then in that callback function, switch your picture to another one.

Well looking at your source code of the page, you might want to change this line:
$("img.tv").attr("src", newSRC);
to this:
$("img.tv").delay('1000').attr("src", newSRC);
Check and see if this works.

Play Sound AND Swap Image onClick (Menu Bar)

EDIT: I found the solution. Embarrassingly simple. I removed the following line of code:
e.preventDefault();
Worked like a charm. Obviously, I'm quite the noob with js. I'm off to Code Academy to remedy that. :)
I don't know that my original question was worded very well (I was tired, sorry!) so let me try this another way.
I've been searching for days to solve this, here at SA, other forums, and the mighty Google. So far, no luck.
I have a horizontal menu. I'd like to make each link play a sound AND swap images onClick. I've gotten it to play the sound and swap the images, but the anchor link doesn't send you down the page to the appropriate text section.
Removing the js that controls the image swap (located at the bottom of the html) resolves the anchor link problem. But I need both the sound and image events to occur.
I've only coded the first two links thus far.
Hopefully, this explains my problem better.
Thanks again, all.

The href of your anchor tags are #. This won't change/reload the page, it will just change the url fragment. See http://en.wikipedia.org/wiki/Fragment_identifier

As noted above, removing the following line of code solved the problem.
e.preventDefault();
I hope this helps someone as green as I am with js from agonizing over something simple, as I did. Sheesh!

Page flickers on load - hide/show javascript - Total Newbie

Ok so here goes.. I'm totally new to Javascript. I only started on html&css about a month ago. All my htl and css is probably pretty backward and i've got a stack to learn. I'm using two pieces of javascript - one piece loads the nivo slider and the other the hide and show easy tabs:
http://www.kollermedia.at/archive/2007/07/04/easy-tabs-11-free-tab-menu/
Both were fine when I hacked them to hell trying to get them to look the way I wanted. Since i've put them together all hell has broken loose (bit of an exageration) but it may as well have because although they are both working, the page flickers badly on load. I have been researching this and I hear it's called DOM flicker. I know it's due to the hidden divs showing before the script kicks in. I also notice that the increased page height, for the split second (sometimes longer) it takes the content to hide activates the scroll bars and i know this could have an affect. I'm also using background images within the links on mouse over commands.... i didn't know what else to do.
I've read you can add script to only show the content once the script has loaded but I know zero javascript : ) ... yet!
Can somebody please help me fix this? I've read lots of posts around the net but they all put the code with gaps where your supposed to fill in and where it's put is expected to be known. I'm sorry to be such a mong but could someone literally copy and paste my javascript and edit that to show me?
I know it's a lot too ask but i've been trying to fix this all day.
Here's a link showing the problem (when selecting the portfolio links the delay / flicker lasts ages!)
link to the site: http://www.adam-ashton.co.uk/homepage.html
(sorry to be so long winded)
Thanks,
David

Page Flicker can be handled with the help of some css
.hideME {
visibility:hidden;
}
Add this class to the Top Most Element (Mostly a div ) of you html page
And inside the script tag ,
write a window.load function
$(window).load(function() {
$(selector).removeClass('hideMe');
});
this should do the magic :)

Add this one line code at 46th line .. Means first line of window.load
$('.container').removeClass('hideMe');

fake/automate a "hover" in JavaScript/jquery?

I want to put this nav bar on my website, here is the demonstration page: http://insicdesigns.com/demo/css3/exp1/index.html
it uses JavaScript, jQuery, and CSS
The problem is, on my site I use PHP and a index.php?page=home, ?index.php?page=contact, etc.
And I can't figure out how to set an item on the bar as "active" [it defaults to "Home"]. I looked into the code, and I found out that the first <li> [the Home] has class="active". I tried simply moving the class to the second item, ["About"] but that just screws everything up, by moving the whole animation to the right which does not work as it is meant to. So on the .click(), this is how it sets an item active:
$(this).siblings('li').removeClass('active'); // removes active
$(this).addClass('active');
So I put id="target" on another item, and with Chrome's JS Console I type in the same code, except I use "#target" instead of "this"
But nothing immediately changes. I have to hover over the bar, for the animation to start, look for the active item, and move the animation over there. Right now, if I use this to replace my current nav bar [which is here], and if someone goes to index.php?page=contact I can't make the About link active so that the user knows they're on the About page!
So here is my question:
Is there a way to tell jQuery I just hovered, from some code? [fool it]
something like:
$("#target").fakeEvent("hover");
So that it runs the code [which, btw, is attached to a function(){} inside a $(selector).hover() -- look at the lavalamp.js file on the example]? If you can help, I'd really appreciate it! Thanks :)

Well, hover consist of two events, mouseenter and mouseleave.
You can trigger the mouseenter event with:
$("#target").mouseenter();

Answer: http://jsfiddle.net/morrison/4CU4H/
Notes on answer:
The fancy menu uses poor JavaScript. I have adapted the script to fix some bugs as well as optimize performance. Use my JavaScript instead of theirs.
To get the active class in the correct position on page-load, simply apply the active class where you would like before jQuery is called. You should probably set the active class in your php output. This also allows for nice style degradation when JavaScript won't load.
The plug-in disables clicking because it's an example. You'll probably want to remove the return statement in the click function.
Notes on your website:
Hide your queries. This isn't a hard rule, but in your case you should. http://www.macdonaldfamilysingers.com/?page=contactindex.php?page=contact should be http://www.macdonaldfamilysingers.com/contact/. Here's a tutorial on url rewriting.
You'll probably want to beautify your tables. By removing some of the borders and spacing, it'll also take up less visual space.