Простейшая техника Rollover / Hover

Мне любопытно узнать, что люди думают, что нынешний лучший способ пойти о базовом бросков действий - jQuery или CSS?

Я хочу перевернуться с этими состояниями:

• Нормальный: абзацы текста в Div
• Наведите курсор: абзацы текста исчезают, фотография исчезает, в том же положении, что и текст
• onmouseout: фотография исчезнет, ​​текст исчезает обратно.

Фотография оба известные размеры.

90% отказов, которые я нашел онлайн, которые я нашел в Интернете, специально для меню, используя спрайты, которые не то, что я после того, как я после, а остальные 10% берутся в том, что: Hover - это хорошая практика Отказ

Мне интересно, что люди думают, что самая простая техника в эти дни - минимум код, наименее сложность, наиболее совместимыми.

Безловер добавлен еще, HTML похож на это:

<div id="box1">
    <p>Pitchfork photo booth, DIY cardigan messenger bag butcher Thundercats tofu you probably haven't heard of them whatever squid VHS put a bird on it. </p>
</div>

CSS:

#box1 {
    width:403px;
    height:404px;
    background-image:url('../images/bio_square1.jpg');
    background-repeat:no-repeat;
    color:#fff;
}