OnMouseOver com a mesma imagem. É possível?

Boa Tarde,

Estou montando um site onde a maioria dos botões são feitos com imagens, e para dar um efeito melhor usei o famoso "OnMouseOver", funciona de boa, porém quando a pessoa entrar no site a imagem "out" só carrega quando ela coloca o cursos em cima do botão. Em conexões mais lentas a segunda imagem pode nem chegar a carregar e isso seria um problema, pois ficaria aquele quadrado sem imagem e o efeito não funcionaria.

Pensando nisso, gostaria de saber se existe uma maneira de fazer o "OnMouseOver" com a mesa imagem, ou seja, seria uma imagem contendo o "in" e o "out" portanto a imagem que ficaria aparecendo no botão seria a primeira parte (in) e quando a pessoa passa o mouse a imagem simplesmente troca de posição e então aparece a segunda parte (out). Isso é possível?

Tenho quase certeza de que já vi um tutorial desses explicando como se faz mas sem querer apaguei o histórico aqui e nunca mais consegui encontrar, rs.

Se não for possível isso, gostaria de saber então como faço um "preload" das imagem "out" para que assim elas carreguem sem a pessoa ter que passar o mouse em cima.

Então é isso pessoal, aguardo resposta, e fico muito feliz de fazer parte do melhor fórum para tirar as minhas dúvidas nessa parte.

Obrigado à todos!