Трябва ми галерия такава

J

jooorooo

Registered
значи трябва ми такава галерия
gal.png
като се посочи на стрелките и да се движи в дадената посока.
 
http://web-tourist.net/login/login/view.php?st=1647
Виж това. За форум е, но според мен лесно ще се нагласи и за без форум ;)
 
FirstBlood каза:
http://web-tourist.net/login/login/view.php?st=1647
Виж това. За форум е, но според мен лесно ще се нагласи и за без форум ;)
Увеличете...

Мен ми трябва да е със стрелки, не така. :?
 
Това е целия код:
ще го разбереш.
Код: 
<html>
<head>
      <title></title>
      <style type="text/css">
         dl.gallery { margin: 0; padding: 0; width: 573px; height: 380px; overflow: hidden; background-image: url('fabrika1.jpg'); }

       	 dl.gallery dt {
            width: 130px; height: 270px;
            padding-right: 40px;
			padding-left: 10px;
            text-align: center;
            overflow: auto;
            font-size: 0;
            float: left;
         }

         dl.gallery dt img {
            border: 1px solid #000;
            margin: 5pt 0;
         }

         dl.gallery dd {
            background: url('loader.gif') no-repeat center;
            height: 270px; width: 360px;
            margin: 0; padding: 0;
            position: relative;
            text-align: center;
            float: left;
         }

		 dl.gallery dt, dl.gallery dd { margin-top: 80px; }
		 
         a.up, a.down {
            background-repeat: no-repeat;
            width: 14px; height: 14px;
            position: absolute;
            cursor: pointer;
            display: block;
            font-size: 0;
            left: -40px;
         }

         a.down { bottom: 20px; background-image: url('down.gif'); }
         a.up { top: 20px; background-image: url('up.gif'); }

         br.bent { clear: both; }
      </style>
      <script type="text/javascript">
         function Elements( OBJ, TagName ) {
            return OBJ.getElementsByTagName( TagName.toUpperCase() );
         }

         function Element( ID ) { return document.getElementById( ID ); }

         function GetDelta(e) {
            if(!e) e = window.event;

            if( e.wheelDelta )
               delta = e.wheelDelta/120;
            else if( e.detail )
               delta = -e.detail/3;

            return delta;
         }

         function PreventDefault( e ) {
            if( window.event )
               window.event.returnValue = false;
            else if( e )
               e.preventDefault();
         }

         function Gallery( ID, e ) {
            var SELF      = this;

            SELF.gallery   = Element(ID);
            SELF.thumbs      = Elements( SELF.gallery, 'dt' )[0];
            SELF.timer      = null;
            SELF.step      = 5;

            SELF.thumbs.style.overflow   = 'hidden';

            var Images   = Elements( this.gallery, 'img' );
            var count   = Images.length;

            SELF.pic   = Images[--count];

            SELF.pic.style.visibility   = 'hidden';
            SELF.pic.onload   = function() {
               this.style.visibility   = 'visible';
            }

            for(var i=0; i<count; i++) {
                Images[i].onclick   = function(e) {
                   SELF.pic.style.visibility   = 'hidden';
                   SELF.SetPic( this.parentNode.href );
                  PreventDefault(e);
               }
            }

            var Links   = Elements( this.gallery, 'a' );
            var Down   = Links[Links.length - 2];
            var Up      = Links[Links.length - 1];

            Up.onmouseover   = function() {
               SELF.timer   = window.setInterval( function() { SELF.Scroll(1, 5) }, 1 );
            }

            Down.onmouseover   = function() {
               SELF.timer   = window.setInterval( function() { SELF.Scroll(-1, 5) }, 1 );
            }

            Up.onmouseout = Down.onmouseout = function() { window.clearInterval(SELF.timer); }

            SELF.thumbs.onmousewheel = function(e) {
               SELF.Scroll(-GetDelta(e), 20);
               PreventDefault(e);
            }

            if( window.addEventListener ) {
               SELF.thumbs.addEventListener(
                  'DOMMouseScroll',
                  function(e) {
                     SELF.Scroll(-GetDelta(e), 20);
                     PreventDefault(e);
                  },
                  false
               );
            }
         }

         Gallery.prototype.SetPic   = function( SRC ) {
            this.pic.src   = SRC;
         }

         Gallery.prototype.Scroll   = function( DIR, STEP ) {
            this.thumbs.scrollTop += DIR * STEP;
         }
      </script>
   </head>

   <body>
  
            
      <dl class="gallery" id="gallery1"> 
	      <dt class="thumbs">
            <a href="K1.jpg">
               <img src="K1thumbnail.jpg" alt="" /></a>
            <a href="K2.jpg">
               <img src="K2thumbnail.jpg" alt="" /></a>
            <a href="K3.jpg">
               <img src="K3thumbnail.jpg" alt="" /></a>
            <a href="K4.jpg">
               <img src="K4thumbnail.jpg" alt="" /></a>
            <a href="K4.jpg">
               <img src="K4thumbnail.jpg" alt="" /></a>
            <a href="K4.jpg">
               <img src="K4thumbnail.jpg" alt="" /></a>
         </dt>
         <dd>
            <a href="#top" class="up"></a>
            <a href="#bottom" class="down"></a>
            <img src="K1.jpg" alt="" />
         </dd>
      </dl>

      <script type="text/javascript">
         /*<![CDATA[*/ new Gallery( 'gallery1' ); //]]>
      </script>
   <dl class="gallery" id="gallery2"> 
	      <dt class="thumbs">
            <a href="K1.jpg">
               <img src="K1thumbnail.jpg" alt="" /></a>
            <a href="K2.jpg">
               <img src="K2thumbnail.jpg" alt="" /></a>
            <a href="K3.jpg">
               <img src="K3thumbnail.jpg" alt="" /></a>
            <a href="K4.jpg">
               <img src="K4thumbnail.jpg" alt="" /></a>
            <a href="K4.jpg">
               <img src="K4thumbnail.jpg" alt="" /></a>
            <a href="K4.jpg">
               <img src="K4thumbnail.jpg" alt="" /></a>
         </dt>
         <dd>
            <a href="#top" class="up"></a>
            <a href="#bottom" class="down"></a>
            <img src="K1.jpg" alt="" />
         </dd>
      </dl>

      <script type="text/javascript">
         /*<![CDATA[*/ new Gallery( 'gallery2' ); //]]>
      </script>

   </body>
</html>
 
Явно аз не се изразяявам правилно, трябва ми хоризонтално скролван, може и на текст, каквото и да е, но да е хоризонтално със стрелки. :oops:
 
Виж това. За сега само това намерих. Единствения проблем е че е с натискане на стрелките :)
Сега съм в процес на търсене, ако изникне нещо веднага ще го постна ;)

Edit:

Това мисля, че е вече това, което търсиш ;) Просто трябва да си пооправиш кода:

<html>
<head>
<style type="text/css">
#divUpControl{position:absolute; left:330; top:10; z-index:1; text-align: right}
#divDownControl{position:absolute; left:330; top:270; z-index:1; text-align: right}
#divLeftControl{position:absolute; left:10; top:10; z-index:1; text-align: right}
#divRightControl{position:absolute; left:10; top:270; z-index:1; text-align: right}
#divContainer{position:absolute; width:320; height:240; overflow:hidden; top:30; left:10; clip:rect(0,320,240,0); visibility:hidden}

#divContent{position:absolute; width: 600px; top:0; left:0}
</style>
<script language="JavaScript">// begin absolutely positioned scrollable area object scripts
/*
Horizontal scroll added by BrownBear (www.devsoftware.com)
Extension developed by David G. Miles (www.z3roadster.net/dreamweaver)
Original Scrollable Area code developed by Thomas Brattli
To add more shock to your site, visit www.DHTML Shock.com
*/

function verifyCompatibleBrowser(){
this.ver=navigator.appVersion
this.dom=document.getElementById?1:0
this.ie5=(this.ver.indexOf("MSIE 5")>-1 && this.dom)?1:0;
this.ie4=(document.all && !this.dom)?1:0;
this.ns5=(this.dom && parseInt(this.ver) >= 5) ?1:0;

this.ns4=(document.layers && !this.dom)?1:0;
this.bw=(this.ie5 || this.ie4 || this.ns4 || this.ns5)
return this
}
bw=new verifyCompatibleBrowser()


var speed=50

var loop, timer

function ConstructObject(obj,nest){
nest=(!nest) ? '':'document.'+nest+'.'
this.el=bw.dom?document.getElementById(obj):bw.ie4?document.all[obj]:bw.ns4?eval(nest+'document.'+obj):0;
this.css=bw.dom?document.getElementById(obj).style:bw.ie4?document.all[obj].style:bw.ns4?eval(nest+'document.'+obj):0;
this.scrollHeight=bw.ns4?this.css.document.height:this.el.offsetHeight
this.clipHeight=bw.ns4?this.css.clip.height:this.el.offsetHeight
this.up=MoveAreaUp;this.down=MoveAreaDown;

this.scrollWidth=bw.ns4?this.css.document.width:this.el.offsetWidth
this.clipWidth=bw.ns4?this.css.clip.width:this.el.offsetWidth
this.left=MoveAreaLeft;this.right=MoveAreaRight;


this.MoveArea=MoveArea; this.x=0; this.y=0;
this.obj = obj + "Object"
eval(this.obj + "=this")
return this
}
function MoveArea(x,y){
this.x=x;this.y=y
this.css.left=this.x
this.css.top=this.y
}

function MoveAreaDown(move){
if(this.y>-this.scrollHeight+objContainer.clipHeight){
this.MoveArea(this.x,this.y-move)
if(loop) setTimeout(this.obj+".down("+move+")",speed)
}
}
function MoveAreaUp(move){
if(this.y<0){
this.MoveArea(this.x,this.y-move)
if(loop) setTimeout(this.obj+".up("+move+")",speed)
}
}
function MoveAreaRight(move){
if(-this.x + objContainer.clipWidth < this.scrollWidth){
this.MoveArea(this.x-move,this.y)
if(loop) setTimeout(this.obj+".right("+move+")",speed)
}
window.status = "right no action " + this.x;
}
function MoveAreaLeft(move){
if(this.x<0){
this.MoveArea(this.x-move,this.y)
if(loop) setTimeout(this.obj+".left("+move+")",speed)
}
window.status = "left no action " + this.x;
}

function PerformScroll(direction,speed){
if(initialised){
loop=true;
if(direction == 0)
{
if(speed>0) objScroller.down(speed)
else objScroller.up(speed)
}
else
{
if(speed>0) objScroller.right(speed)
else objScroller.left(speed)
}
}
}

function CeaseScroll(){
loop=false
if(timer) clearTimeout(timer)
}
var initialised;
function InitialiseScrollableArea(){
objContainer=new ConstructObject('divContainer')
objScroller=new ConstructObject('divContent','divContainer')
objScroller.MoveArea(0,0)
objContainer.css.visibility='visible'
initialised=true;
}
// end absolutely positioned scrollable area object scripts

</script>
</head>
<body bgcolor="999999" onLoad="InitialiseScrollableArea()">

<div id="divUpControl"> <a href="javascript:;" onMouseOver="PerformScroll(0,-7)" onMouseOut="CeaseScroll()">[scroll
up]</a> </div>
<div id="divDownControl"> <a href="javascript:;" onMouseOver="PerformScroll(0,7)" onMouseOut="CeaseScroll()">[scroll
down]</a> </div>
<div id="divLeftControl"> <a href="javascript:;" onMouseOver="PerformScroll(1,7)" onMouseOut="CeaseScroll()">[scroll
left]</a> </div>
<div id="divRightControl"> <a href="javascript:;" onMouseOver="PerformScroll(1,-7)" onMouseOut="CeaseScroll()">[scroll
right]</a> </div>
<div id="divContainer">
<div id="divContent"> <b>Scroll Area Content Start</b>
<p> Lorem ipsum dolor sit amet, consectetur adipscing elit, sed diam nonnumy
eiusmod tempor incidunt ut labore et dolore magna aliquam erat volupat.</p>
<p>Et harumd dereud facilis est er expedit distinct. Nam liber a tempor ***
soluta nobis eligend optio comque nihil quod a impedit anim id quod maxim
placeat facer possim omnis es voluptas assumenda est, omnis dolor repellend.
Temporem autem quinsud et aur office debit aut tum rerum necesit atib saepe
eveniet ut er repudiand sint et molestia non este recusand.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipscing elit, sed diam nonnumy
eiusmod tempor incidunt ut labore et dolore magna aliquam erat volupat.</p>
<p>Et harumd dereud facilis est er expedit distinct. Nam liber a tempor ***
soluta nobis eligend optio comque nihil quod a impedit anim id quod maxim
placeat facer possim omnis es voluptas assumenda est, omnis dolor repellend.
Temporem autem quinsud et aur office debit aut tum rerum necesit atib saepe
eveniet ut er repudiand sint et molestia non este recusand.</p>
<b>Scroll Area Content End</b> </div>
</div>

</body>
</html>

Кода е взет от тук.
 
Жоро, обясни какво точно ти трябва :) Защото на кода, който дадох, може да му се махнат скролирането на горе и надолу и да се сложат стрелки за на ляво и на дясно и стреклите да се преместят от страни :) За това не мога да разбера какво точно ти трябва, обясни, за да знам какво да търся ;)
 
трябва му стрелки едната на ляво другата на дясно и между тях да има снимки и като посочиш стрелката на дясно да се движи на дясно така е и за лявата стрелка!
 
Трябва да си влезнал или регистриран, за да отговориш тук.

Back
Горе