- $(document).ready(function(){
- $("img.templates").mouseover(
- function() {
- $("img.head").stop().animate({"opacity": "0"}, "slow");
- },
- function() {
- $("img.head-templates").stop().animate({"opacity": "1"}, "slow");
- });
- $("img.templates").mouseout(
- function() {
- $("img.head").stop().animate({"opacity": "1"}, "slow");
- },
- function() {
- $("img.head-templates").stop().animate({"opacity": "0"}, "slow");
- });
- $("img.projects").mouseover(
- function() {
- $("img.head").stop().animate({"opacity": "0"}, "slow");
- },
- function() {
- $("img.head-projects").stop().animate({"opacity": "1"}, "slow");
- });
- $("img.projects").mouseout(
- function() {
- $("img.head").stop().animate({"opacity": "1"}, "slow");
- },
- function() {
- $("img.head-projects").stop().animate({"opacity": "0"}, "slow");
- });
- });
But what happens when I mouseover projects instead of turning from head into head-projects into animates into head-templates... I've checked all the images and all are fine... Can someone please gimme a code fix and tell me what was wrong so I know for future reference!