Хочешь красочно оформить новости, но не знаете какой скрипт и какой вид новостей будет лучше смотреться для ваших новотей? Тогда, к вашему внимаю представляю пять готовых решении этих проблем: 
 Данные решения помогут ваш красочно отобразить и показать все своим новости на вашем сайте.  
Установка CSS  Код
<link rel="stylesheet" href="/example/10/HoverNews/hovernews.css"/>
 вставить данный код перед 
  Код
<script type="text/javascript" src="/example/10/HoverNews/hovernews.js"></script>
 Смысл в том, что когда наводишь на картинку в правой стороне выскакивает блог с иконками, иконки как и ссылку - туда можно вставить все что угодно. Эффекты на иконки разные.  
Код
<div class="he-wrap tpl1"> 
   <img src="HoverNews/1.jpg" alt=""/> 
   <div class="he-view"> 
   <div class="sider-right a0" data-animate="fadeInRight"> 
   <a href="#" class="a1 zoom" data-animate="fadeInRight"></a> 
   <a href="#" class="a2 undo" data-animate="fadeInRight"></a> 
   <a href="#" class="a3 check" data-animate="fadeInRight"></a> 
   <a href="#" class="a4 close" data-animate="fadeInRight"></a> 
   </div> 
   </div> 
 </div>
Код
<div class="he-wrap tpl1"> 
 <img src="HoverNews/2.jpg" alt=""> 
 <div class="he-view"> 
 <div class="sider-right a0" data-animate="fadeInRight"> 
   <a href="#" class="a1 zoom" data-animate="rotateIn"></a> 
   <a href="#" class="a2 undo" data-animate="rotateIn"></a> 
   <a href="#" class="a3 check" data-animate="rotateIn"></a> 
   <a href="#" class="a4 close" data-animate="rotateIn"></a> 
 </div> 
 </div> 
 </div>
Код
<div class="he-wrap tpl1"> 
 <img src="HoverNews/3.jpg" alt=""> 
 <div class="he-view"> 
 <div class="sider-right a0" data-animate="fadeInRight"> 
   <a href="#" class="a1 zoom" data-animate="pendulum"></a> 
   <a href="#" class="a1 undo" data-animate="pendulum"></a> 
   <a href="#" class="a1 check" data-animate="pendulum"></a> 
   <a href="#" class="a1 close" data-animate="pendulum"></a> 
 </div> 
 </div> 
 </div>
Код
<div class="he-wrap tpl2"> 
 <img src="HoverNews/4.jpg" alt=""> 
 <div class="he-view"> 
 <div class="bg a0" data-animate="fadeIn"> 
 <div class="center-bar"> 
   <a href="#" class="twitter a0" data-animate="elasticInDown"></a> 
   <a href="#" class="facebook a1" data-animate="elasticInDown"></a> 
   <a href="#" class="google a2" data-animate="elasticInDown"></a> 
   <a href="#" class="in a3" data-animate="elasticInDown"></a> 
 </div> 
 </div> 
 </div> 
 </div>
Код
<div class="he-wrap tpl2"> 
 <img src="HoverNews/5.jpg" alt=""> 
 <div class="he-view"> 
 <div class="bg a0" data-animate="fadeIn"> 
 <div class="center-bar"> 
   <a href="#" class="twitter a0" data-animate="fadeInUp"></a> 
   <a href="#" class="facebook a1" data-animate="fadeInUp"></a> 
   <a href="#" class="google a2" data-animate="fadeInUp"></a> 
   <a href="#" class="in a3" data-animate="fadeInUp"></a> 
 </div> 
 </div> 
 </div> 
 </div>
Код
<div class="he-wrap tpl2"> 
 <img src="HoverNews/6.jpg" alt=""> 
 <div class="he-view"> 
 <div class="bg a0" data-animate="fadeIn"> 
 <div class="center-bar"> 
   <a href="#" class="twitter a0" data-animate="rotateInLeft"></a> 
   <a href="#" class="facebook a1" data-animate="rotateInLeft"></a> 
   <a href="#" class="google a2" data-animate="rotateInLeft"></a> 
   <a href="#" class="in a3" data-animate="rotateInLeft"></a> 
 </div> 
 </div> 
 </div> 
 </div>
Код
<div class="he-wrap tpl3"> 
 <img src="HoverNews/1_1.jpg" alt=""> 
 <div class="he-view"> 
 <div class="info-bottom a0" data-animate="fadeInUp"> 
   Квантовая механика — раздел теоретической физики 
 </div> 
 </div> 
 </div>
Код
<div class="he-wrap tpl3"> 
 <img src="HoverNews/1_2.jpg" alt=""> 
 <div class="he-view"> 
 <div class="info-top a0" data-animate="fadeInDown"> 
   Квантовая механика — раздел теоретической физики 
 </div> 
 </div> 
 </div>
Код
<div class="he-wrap tpl3"> 
 <img src="HoverNews/1_3.jpg" alt=""> 
 <div class="he-view"> 
 <div class="info-fly a0" data-animate="flipInV"> 
   Квантовая механика — раздел теоретической физики 
 </div> 
 </div> 
 </div>