We Keep Coding

Turning this JS Code for Text Animation from "on click" to automatic when HTML page loads?

I'm trying to implement this text animation (N.10 from https://speckyboy.com/css-javascript-text-animation-snippets/)
so I copied the HTML and the CSS code worked fine. I got rid of the reload button because that needs to go away. I know that I am supposed to copy the js script code into the head section for it to load automatically, however... I don't know how to "rewrite" it so it stops being a click action...and just becomes a "normal" function.
$(function() {
$('.intro').addClass('go');
$('.reload').click(function() {
$('.intro').removeClass('go').delay(200).queue(function(next) {
$('.intro').addClass('go');
next();
});
});
})
(I got this from the link obviously)
I'll make sure to use the ".onload" to get it to run when page is loaded. it's probably a very easy thing to do but got kind of confused...
I'd be very grateful for the help! Thank you :)

It's the part that is not
$(selector).click(function() {});
In your case, delete the framed block
$(function() {
$('.intro').addClass('go');
$('.reload').click(function() {
$('.intro').removeClass('go').delay(200).queue(function(next) {
$('.intro').addClass('go');
next();
});
});
})

If i get you right, you removed the reload button, but that didn't reflect in your js code. $(function() { $('.intro').addClass('go'); $('.intro').removeClass('go').delay(200) .queue(function(next) { $('.intro').addClass('go'); next(); }); })
What i did here was to remove the click event added to the non existing reload button. But you will need to tweak the code to remove the go class and cause the delay. Hope it helps.

remove it from on click on add it to document.ready like this
$(document).ready(function(){
$('.intro').addClass('go');
$('.intro').removeClass('go').delay(200).queue(function(next) {
$('.intro').addClass('go');
next();
});
});

Jquery show/hide hover or mouse enter issue

Ok so im trying to get some text that is hidden to display when the mouse enters the div then hide when it leaves
so far ive got this on my fiddle
$(document).ready(function() {
$(".image").mouseover(function(){
$(".hover").show();
})
$(".image").mouseout(function(){
$(".hover").hide();
});
Thanks any help would be great

You Should Read Basic of JavaScript
$(document).ready(function() {
$(".image").mouseover(function(){
$(".hover").show();
})
$(".image").mouseout(function(){
$(".hover").hide();
});
})//added
Updated Demo

You were missing a });
Also, you can simplify your code to:
$(document).ready(function () {
$(".image").mouseover(function () {
$(".hover").show();
}).mouseout(function () {
$(".hover").hide();
});
});
BTW, your HTML is broken. Fix that first.

Both your HTML and JS code are badly written. And you didn't include jQuery is your jsfiddle, which means that '$' isn't recognized.
$(document).ready(function() {
$(".image").mouseover(function(){
$(".hover").show();
});
$(".image").mouseout(function(){
$(".hover").hide();
});
});
You can test it here: http://jsfiddle.net/5PR5E/3/

Make link non clickable using javascript

I have this code which i've seen online and trying to implement it.
What i'm trying to do is to make all the links with the parent class non clickable, i mean, it should click but not redirect to the page's link.
This won't work..
<script>
$(window).load(function(){
$(document).ready(function(){
$('.parent').click(function(){
return false; // prevents default action
});
}
})
</script>

Try this:
$(document).ready(function(){
$('.parent').click(function(e){
e.preventDefault();
});
});
You don't need $(window).load(function(){ because $(document).ready(function(){ is the same thing!
Later Edit: I have to complete this answer by telling you that the code I wrote is using jQuery library, which must be included in your project. For more info about jQuery please visit http://jquery.com/

you need event.preventDefault
function unclickable(e) {
e.preventDefault();
}
Alternatively return false;
function unclickable() {
return false;
}
and use it like:
<a class="parent" onclick="unclickable(event);">Link</a>

jQuery SlideToggle() Not Working in FireFox, Works in Chrome

My code is this:
jQuery('.cart-module .cart-heading').bind('click', function() {
if (jQuery(this).hasClass('active')) {
jQuery(this).removeClass('active');
} else {
jQuery(this).addClass('active');
}
jQuery(this).parent().find('.cart-content').slideToggle('slow');
});
//--></script>
You can test it for yourself by quickly adding a product to your cart like this https://muddydogcoffee.com/teas/176-organic-crimson-berry-fruit-tisane?device=iphone and going to the shopping cart here https://muddydogcoffee.com/shopping-cart.
When you click "Estimate Shipping & Taxes," it should display the DIV underneath of it. However, it only works in Chrome and not in Firefox. What can I do to fix this?
Thanks.

I had the same problem before, I haven't really understood why it happens but I found a workaround for it.
I am not sure if it will also work for you but what I did is I removed the display:none in the stylesheet and just added it inline in the html.
If anyone could explain the strange behavior it will really be helpful though.

Add event.preventDefault(); and event.stopPropagation(); for this to work in all browsers including Firefox. See Snippet below:
jQuery('.cart-module .cart-heading').bind('click', function(e) {
e.preventDefault();
e.stopPropagation();
if (jQuery(this).hasClass('active')) {
jQuery(this).removeClass('active');
} else {
jQuery(this).addClass('active');
}
jQuery(this).parent().find('.cart-content').slideToggle('slow');
});

Have you tried :
$(document).ready(function() {
// put all your jQuery goodness in here.
});

jQuery code works in Firebug, but not on its own

I'm having quite the brainbuster of an issue right now. I am trying to change a link's hash tag at the end from "respond" to "comments" with jQuery. I have a simple script that should do this, however it does not work. The link does not change. However, Firebug shows no errors and when I run the code in Firebug's console, it works just as I intend. Why doesn't this work on its own? Does anybody have a solution, I'm at my wits edge with this one.
(function ($) {
$(document).ready(function() {
$("a[href$='respond']").each(function() {
$(this).attr("href", $(this).attr('href').replace("respond", "comments"));
});
});
})(jQuery.noConflict());
Thanks so much, I know this might be a pain to test but I'm really thankful.

Your code should be working fine, but your script tag is malformed. You have text/javscript instead of text/javascript. Also, you can optimize your code a little:
<script type="text/javascript">
jQuery(document).ready(function($){
$("a[href$='respond']").attr("href", function(index, attr){
return attr.replace("respond", "comments");
});
}).noConflict();
</script>

You're using $(document).load() instead of $(document).ready().
(function ($) {
//---------------v
$(document).load(function() {
$("a[href$='respond']").each(function() {
$(this).attr("href", $(this).attr('href').replace("respond", "comments"));
});
});
})(jQuery.noConflict());

Why not just:
jQuery(function($) {
$("a[href$='respond']").each(function() {
$(this).attr("href", $(this).attr('href').replace("respond", "comments"));
});
});
If you pass a function to the jQuery constructor it adds it to the DOM Ready listeners and automatically passes itself as an argument.