Горизонтальный Scroll bar новостей, видел ли кто?

[IgorA100 90]

Понравилась горизонтальная прокрутка реализованная тут http://ocs.ru/ (в верхней части идет прокрутка производителей, сразу под верхним большим баннером)

Погуглил, но ничего путного не нашел

[alex32 934]

не там ищете. http://valums.com/scroll-menu-jquery/ вот неплохой вариант, даже лучше вашего примера, просто наберите в яндухе "скрол jQuery" вариантов масса

[IgorA100 90]

вот неплохой вариант

Да, действительно неплохой

Спасибо.

[alex32 934]

да на здоровье

[IgorA100 90]

Вот еще интересное решение. Собственно о нем получается я изначально спрашивал

http://jscrollpane.kelvinluck.com/

Немного пришлось повозиться для кроссбраузного решения при резиновой верстке и неопределенной ширине контента (т.к. идет выборка из новостей)

Сам шаблон:

<div class="wrapper_clb">

    <div id="clients_bar">

	    <div class="scroll-pane horizontal-only ">

		    <ul>    

			    <table border="0" cellspacing="0" cellpadding="0"><tr>

				    {custom category="22,1,2,3,4,5,6,7,8,9" template="slaider" aviable="global" from="0" limit="100" cache="no"}

			    </tr></table>

		   </ul>

	    </div>	    

    </div>  

</div>

Файл стилей:

.wrapper_clb {

max-width: 1500px;

text-align: center;

width:  98%; /* НЕ ТРОГАТЬ ЗНАЧЕНИЕ!!!*/

margin: 0 auto;

}

.scroll-pane

{

width: 100%;

height: 200px;

overflow: auto;

}

.horizontal-only

{

height: auto;

max-height: 150px;

}

#clients_bar  {

position:relative;

margin: 15px auto;

-moz-border-radius: 5px;

-webkit-border-radius: 5px;

border-radius: 5px;

}

#clients_bar .left_part {

    height: 50px;

    left: 0;

    position: absolute;

    top: 0;

    width: 30px;

    z-index: 10;

}

#clients_bar .right_part {

    height: 50px;

    position: absolute;

    right: 0;

    top: 0;

    width: 30px;

    z-index: 10;

}

#clients_bar ul {

    list-style: none outside none;

    margin: 0;

    padding: 0;

    white-space: nowrap;

width:100%;

}

#clients_bar table {

    list-style: none outside none;

    margin: 0;

    padding: 0;

    white-space: nowrap;

position:absolute;

}

#clients_bar li {

    background: none repeat scroll 0 0 transparent;

    display: inline;

    float: left;

    margin: 0 10px 0 10px;

    overflow: hidden;

    padding: 0;

    position: relative;

    text-align: center;

}

#clients_bar li img {

    left: 0;

max-height: 25px;

    top: 0;

}

Скрипт JS

  <script type="text/javascript" id="sourcecode">

   $(function()

   {

    $('.scroll-pane').each(

	 function()

	 {

	  $(this).jScrollPane(

	   {

	    maintainPosition: true, horizontalDragMinWidth: 210, horizontalDragMaxWidth: 210, autoReinitialise: true, autoReinitialiseDelay: 0

	   }

	  );

	 }

    )

   });

  </script>

Возможно кому-то пригодится. Долго пришлось возиться самому....