you keep focusing effort on the DIV wrapping the slider, but the not
the UL which is the first block level parent of the slider images. I'm
not sure why overflow on div not working but I would attack the UL with
float, height, overflow etc. With those huge images and therefore very
slow load times whatever you do it will take a while for slider script
to run on load. Alan wrote: Tried that...still same result. On Jul 19, 7:47 pm, Glazz <brunofgas...@live.com.pt> wrote:Hmm i tried to replicate that on my server but whithout success...You can try what i've mentioned in my previous post, display: none; like this: HTML: <div id="slider" align="center" style="display: none;"> JS: Add this $('#slider').css({'display' : 'block'}); After this.each(function() { It will look like this: this.each(function() { $('#slider').css({'display' : 'block'}); Try it please... On 20 Jul, 02:25, Alan <alanblackf...@gmail.com> wrote:I can show css or slider code if it helps.Slider CSS below ------------------------------ @charset "utf-8"; /* CSS Document */ #slidercontent{ position:relative; } #slidercontainer{ margin:0 auto; position:relative; text-align:left; width:896px; background:#fff; margin-bottom:2em; }/* clearfix */#slidercontent:after, ul:after{ content:"."; display:block; height:0; clear:both; visibility:hidden; } #slidercontent, ul{ display:block; } /* \*/ #slidercontent, ul{ min-height:1%; } * html #slidercontent, * html ul{ height:1%; }/* // clearfix *//* image replacement */ .graphic, #header h1, #prevBtn, #nextBtn{ margin:0; padding:0; display:block; overflow:hidden; text-indent:-8000px; } /* // image replacement *//* Easy Slider */#slider{} #slider ul, #slider li{ margin:0; padding:0; list-style:none; } #slider li{ /* define width and height of list item (slide) entire slider area will adjust according to the parameters provided here */ width:896px; height:171px; overflow:hidden; } #prevBtn, #nextBtn{ display:block; width:30px; height:77px; position:absolute; left:-30px; top:41px; } #nextBtn{ left:896px; } #prevBtn a, #nextBtn a{ display:block; width:30px; height:77px; background:url(/includes/sliders/images/btn_prev.gif) no-repeat 0 0; } #nextBtn a{ background:url(/includes/sliders/images/btn_next.gif) no-repeat 0 0; }/* // Easy Slider */Actual Slider Code --------------------------------- (function($) {$.fn.easySlider = function(options){// default configuration properties var defaults = { prevId: 'prevBtn', prevText: '', nextId: 'nextBtn', nextText: '', controlsShow: true, controlsBefore: '', controlsAfter: '', controlsFade: true, firstId: 'firstBtn', firstText: 'First', firstShow: false, lastId: 'lastBtn', lastText: 'Last', lastShow: false, vertical: false, speed: 800, auto: false, pause: 4000, continuous: false };var options = $.extend(defaults, options);this.each(function() { var obj = $(this); var s = $("li", obj).length; var w = $("li", obj).width(); var h = $("li", obj).height(); obj.width(w); obj.height(h); obj.css("overflow","hidden"); var ts = s-1; var t = 0; $("ul", obj).css('width',s*w); if(!options.vertical) $("li", obj).css('float','left');if(options.controlsShow){ var html = options.controlsBefore; if(options.firstShow) html += '<span id="'+ options.firstId +'"><a href="" class="moz-txt-link-rfc2396E" href="_javascript_:void(0);\">"_javascript_:void(0);\">'+ options.firstText +'</a></span>'; html += ' <span id="'+ options.prevId +'"><a href="" class="moz-txt-link-rfc2396E" href="_javascript_:void(0);\">"_javascript_:void (0);\">'+ options.prevText +'</a></span>'; html += ' <span id="'+ options.nextId +'"><a href="" class="moz-txt-link-rfc2396E" href="_javascript_:void(0);\">"_javascript_:void (0);\">'+ options.nextText +'</a></span>'; if(options.lastShow) html += ' <span id="'+ options.lastId +'"><a href="" class="moz-txt-link-rfc2396E" href="_javascript_:void(0);\">"_javascript_:void(0);\">'+ options.lastText +'</a></span>'; html += options.controlsAfter; $(obj).after(html); };$("a","#"+options.nextId).click(function(){ animate("next",true); }); $("a","#"+options.prevId).click(function(){ animate("prev",true); }); $("a","#"+options.firstId).click(function(){ animate("first",true); }); $("a","#"+options.lastId).click(function(){ animate("last",true); });function animate(dir,clicked){ var ot = t; switch(dir){ case "next": t = (ot>=ts) ? (options.continuous ? 0 : ts) : t+1; break; case "prev": t = (t<=0) ? (options.continuous ? ts : 0) : t-1; break; case "first": t = 0; break; case "last": t = ts; break; default: break; };var diff = Math.abs(ot-t); var speed = diff*options.speed; if(!options.vertical) { p = (t*w*-1); $("ul",obj).animate( { marginLeft: p },... read more »- Hide quoted text - - Show quoted text - |
- [jQuery] Could REALLY use some help implementing a slider/carousel... Alan
- [jQuery] Re: Could REALLY use some help implementing a slider... Charlie
- [jQuery] Re: Could REALLY use some help implementing a sl... Alan
- [jQuery] Re: Could REALLY use some help implementing ... Glazz
- [jQuery] Re: Could REALLY use some help implement... Alan
- [jQuery] Re: Could REALLY use some help impl... Alan
- [jQuery] Re: Could REALLY use some help ... Glazz
- [jQuery] Re: Could REALLY use some h... Alan
- [jQuery] Re: Could REALLY use some h... Charlie
- [jQuery] Re: Could REALLY use some h... Alan
- [jQuery] Re: Could REALLY use some h... Alan