Slider funktion erstellen.

thomas.mueller · 3 August 2011

Hi,

ich habe eine Slider der leider nur mit via "klick" funktioniert. Kann man eine Funktion schreiben, damit er nach z.B. 5 sec. automatisch wechselt?

<div id="content">
<div class="slider wide home-switcher-presentation">
<ul class="images">
<li>
<img src="images/samples/wide-slider-1.jpg" alt="" /><span class="gloss"></span></a>
<div class="desc left">
<h2>text</h2>
<p>test</p>
<a href="#" class="button chilli-default arrow-only alignleft"></a>
</div>
</li>
<li>
<img src="images/samples/wide-slider-2.jpg" alt="" /><span class="gloss"></span></a>
<div class="desc right">
<h2>text</h2>
<p>text.</p>
<a href="#" class="button chilli-default arrow-only alignright"></a>
</div>
</li>
<li>
<img src="images/samples/wide-slider-3.jpg" alt="" /><span class="gloss"></span></a>
<div class="desc top">
<h2>text</h2>
<p>text</p>
<a href="#" class="button chilli-default alignright" style="width: 80px">Say Hello!</a>
</div>

</li>
<li>
<img src="images/samples/wide-slider-4.jpg" alt="" /><span class="gloss"></span></a>
<div class="desc right">
<h2>text</h2>
<p>text</p>
<a href="#" class="button style-2 alignright">Read more!</a>
</div>
</li>
</ul>



<div class="displays-border"><div class="center"><div class="left-cap"></div><div class="right-cap"></div></div></div>
<ul class="slider-pagination bottom-middle">
<li class="current"><a href="#">1</a></li>
<li><a href="#">2</a></li>
<li><a href="#">3</a></li>
<li><a href="#">4</a></li>
</ul>
</div>



Vielen Dank im Voraus. ,)

webdesigner95 · 3 August 2011

vieleicht mit setTimeout() oder setInterval()?

Sempervivum · 3 August 2011

Hallo Thomas,
zu diesem Slider gehört doch wahrscheinlich noch mehr dazu, entweder Javascript oder CSS. Hast Du den selber programmiert oder hast Du ihn irgendwo gefunden? Wenn ja wo?
Es gibt so viele vorgefertigte Slider, dass es sich eigentlich nicht lohnt, selber zu programmieren. Schau dir z. B. mal diesen an:
jQuery content slider carousel image slideshow | bxSlider
oder diesen:
Nivo Slider - The Most Awesome jQuery Image Slider
Viele Grüße - Ulrich

threadi · 3 August 2011

Ohne den dazugehörigen JavaScript-Code kann man dir keinen konkreten Tipp geben.

thomas.mueller · 3 August 2011

Hi,

das hier müsste die passenden .js sein ,)

hier meine page gs-makleragentur.de

der slider funktioniert. er soll sich nur auch von allein aller 5-7 sec bewegen.

P.S. danke für die schnellen antworten.

$( function()
{
// SWITCHER BEGIN

var home = ($('div.home-switcher-presentation').length > 0);

function hex(x)
{
return ("0" + parseInt(x).toString(16)).slice(-2);
}

function rgb2hex(rgb)
{
rgb = rgb.match(/^rgb$(\d+),\s*(\d+),\s*(\d+)$$/);

return hex(rgb[1]) + hex(rgb[2]) + hex(rgb[3]);
}

var colors =
{
'color':
[
'a',
'a:hover',
'.gallery * a',
'.gallery-extended .details > *:first-child a',
'.gallery-extended.grid .details a:focus',
'span.dropcap.style-2',
'.news.featured h2 a:focus',
'.comments .author',
'.error404 h3',
'.featured-1 .items li h3 a',
'#nav > ul > li.current > a',
'.menu-1 li.current > a',
'#breadcrumb a',
'.slider-nav-2',
'.slider-nav-3'
],
'background-color':
[
'.tabs.clean .nav li:hover',
'.tabs.clean .content li',
'.slider.background .slider-nav a:focus',
'.slider.pure .slider-nav a:focus',
'.zoombox .slider-nav li a:hover',
'.slider-nav li a:hover',
'.lightbox .nav li a:hover'
],
'border-color':
[
'.tabs.clean .nav li:hover',
'.tabs.clean .content li'
]
};

var skins =
{
'default': { 'name': 'Default', 'style': 'light.css', 'background': 'url(images/gr/1.gif) 0 0 repeat-x' },
'light1': { 'name': 'Light 1 Orange', 'style': 'light.css', 'background': 'url(images/skins/light/bg/1.jpg) 50% 0 no-repeat' },
'light2': { 'name': 'Light 2 Mix', 'style': 'light.css', 'background': 'url(images/skins/light/bg/2.jpg) 50% 0 no-repeat' },
'light3': { 'name': 'Light 3 Sea', 'style': 'light.css', 'background': 'url(images/skins/light/bg/3.jpg) 50% 0 no-repeat' },
'dark1': { 'name': 'Dark 1 Leather', 'style': 'dark.css', 'background': '#111 url(images/skins/dark/bg/1.jpg) 50% 0 repeat' },
'dark2': { 'name': 'Dark 2 Leather', 'style': 'dark.css', 'background': '#111 url(images/skins/dark/bg/2.jpg) 50% 0 repeat' },
'dark3': { 'name': 'Dark 3 Leather', 'style': 'dark.css', 'background': '#111 url(images/skins/dark/bg/3.jpg) 50% 0 repeat' },
'dark4': { 'name': 'Dark 4 Leather', 'style': 'dark.css', 'background': '#111 url(images/skins/dark/bg/4.jpg) 50% 0 repeat' },
'dark5': { 'name': 'Dark 5 Vintage', 'style': 'dark.css', 'background': '#000 url(images/skins/dark/bg/5.jpg) 50% 0 no-repeat' },
'dark6': { 'name': 'Dark 6 Wood', 'style': 'dark.css', 'background': '#111 url(images/skins/dark/bg/6.jpg) 50% 0 repeat' },
'wood': { 'name': 'Wood', 'style': 'wood.css', 'background': '#fff url(images/skins/wood/bg/1.jpg) 50% 0 repeat' }
};

var sliders =
{
'default': { 'name': 'Default' },
'background': { 'name': 'Background' },
'displays': { 'name': 'Displays' },
'piecemaker': { 'name': 'Piecemaker' },
'pure': { 'name': 'Pure' },
'video': { 'name': 'Video' },
'wide': { 'name': 'Wide' },
};

var font_familes =
[
'h1',
'h2',
'h3',
'h4',
'h1 a',
'h2 a',
'h3 a',
'h4 a',
'table.pricing-1 .price',
'table.pricing-1 .price strong',
'table.pricing-1 table.column tr > th',
'table.pricing-1 table.column.current th',
'.pricing-table-button',
'.slider-nav-2 li',
'.slider-nav-3 li',
'#main-heading h2.alt',
'.news.compact .header h2',
'.news.featured h2',
'.comments .author',
'.comments .staff .author',
'.comments .staff .author span',
'.slider .desc h2',
'#footer h3'
];

var fonts =
[
'Diavlo',
'Allerta',
'Allerta Stencil',
'Arimo',
'Arvo',
'Bentham',
'Cantarell',
'Cardo',
'Coda',
'Cousine',
'Covered By Your Grace',
'Crisomo Text',
'Cuprum',
'Droid Sans Mono',
'Droid Sans',
'Droid Serif',
'Geo',
'IM Fell',
'Inconsolata',
'Jangerine',
'Josefin Sans',
'Josefin Slab',
'Just Me Again Down Here',
'Lobster',
'Molengo',
'Neucha',
'Neuton',
'Nobile',
'OFL Sorts Mill',
'Old Standard TT',
'Philosopher',
'PT Sans',
'Puritan',
'Raleway',
'Reenie Beanie',
'Tinos',
'Unifraktur Cook',
'Unifraktur Magunita',
'Vollkorn',
'Yanone Kaffeesatz'
];

$switcher = $('<div />').attr('id', 'switcher-holder').addClass('closed js').load('switcher/switcher.html #switcher-holder > *', function()
{
$('body').append($switcher);

$('div#switcher').show();
$('#switcher-holder').removeClass('closed');

$('#switcher-holder input.color-value').blur( function()
{
$('#switcher-holder input.color-picker').css('background-color', $('#switcher-holder input.color-value').val());
}).change( function()
{
var style = '';
color = $(this).val();

$.each(colors, function(key, elements)
{
$.each(elements, function(index, selector)
{
style += selector + ' {' + key + ':' + color + ';}';
});
});

$('style.colors').remove();
$('<style />').attr('type', 'text/css').text(style).addClass('colors').addClass('custom-rules').appendTo('head');
});

$('#switcher-holder input.color-picker').css('background-color', $('#switcher-holder input.color-value').val()).
ColorPicker
({
onSubmit: function(hsb, hex, rgb, el)
{
$(el).css('background', '#' + hex);
$(el).val('#' + hex);
$('#switcher-holder input.color-value').val('#' + hex).change();
$(el).ColorPickerHide();
},
onBeforeShow: function()
{
$(this).ColorPickerSetColor($('#switcher-holder input.color-value').val());
},
onHide: function(picker, el)
{
$picker = $(picker);
color = $picker.data('colorpicker');
}
}).bind('keyup', function(e)
{
if (e.keyCode == 27)
{
$('#switcher-holder input.color-picker').ColorPickerHide();
}
});

$('#switcher-holder a#reset').click( function()
{
location.reload(true);

return false;
});

$('#switcher-holder a.toggle-switcher').click( function()
{
$(this).next('div#switcher').toggle().parent('#switcher-holder').toggleClass('closed');
});

$.each(skins, function(key, skin)
{
$skin = $('<option />');
$skin.val(key).text(skin['name']);

$('select[name=skin]').append($skin);
});

$.each(sliders, function(key, slider)
{
$slider = $('<option />');
$slider.val(key).text(slider['name']);

$('select[name=slider]').append($slider);
});

$.each(fonts, function(i, font)
{
$font = $('<li />');
$font.append($('<a />').append($('<img />').attr('src', 'switcher/fonts/' + font.toLowerCase().replace(/ /g, '-') + '.png').attr('alt', font)));
$option = $('<option />').text(font).val(font.toLowerCase().replace(/ /g, '-'));

thomas.mueller · 3 August 2011

if (i == 0)
{
$font.addClass('selected');
$option.attr('selected', 'selected');
}

$('select[name=font]').append($option);
$('ul.fonts').append($font);
});

$('select[name=skin]').change( function()
{
skin = skins[$(this).children('option:selected').val()];

$('link[href!=switcher/css/colorpicker.css]').last().remove();
$('head').append($('<link />').attr('rel', 'stylesheet').attr('type', 'text/css').attr('href', skin['style']));
$('body').css('background', skin['background']);
});

$('select[name=slider]').change( function()
{
slider = $(this).children('option:selected').val();

if (slider == 'default')
{
slider = 'wide';
}

if (home)
{
$slider = $('<div />').load('switcher/sliders/' + slider + '.html', function()
{
$('div.slider').first().remove();
$slider = $slider.children().clone();
var images = $slider.find('img').length;
var images_loaded = 0;

$slider.addClass('js');

if (slider == 'piecemaker')
{
$('div#content').prepend($slider);

$('div.slider').first().css
({
'width': '120%',
'height': '500px'
});
} else
{
$slider.find('img').load( function()
{
images_loaded++;

if (images_loaded == images)
{
if (slider == 'background')
{
$('div#container').prepend($slider);
} else
{
$('div#content').prepend($slider);
}

if (slider == 'background')
{
setup_background($('div.background').first());
} else if (slider == 'displays')
{
setup_displays($('div.displays').first());
} else if (slider == 'pure')
{
setup_pure($('div.pure').first());
} else if (slider == 'video')
{
setup_video($('div.video').first());
} else if (slider == 'wide')
{
setup_wide($('div.wide'));
}
}
});
}
});
}
});

$(document).click( function()
{
if ($('ul.fonts').hasClass('opened'))
{
$('ul.fonts').removeClass('opened').addClass('selected');

return false;
}
});

$('select[name=font] + ul.selected').click( function()
{
$(this).addClass('opened').removeClass('selected');
$(this).prev('select').focus();

return false;
});

$('select[name=font] + ul li').click( function()
{
if ($(this).parent().hasClass('opened'))
{
$(this).parent('ul.fonts').scrollTop(0).removeClass('opened').addClass('selected').children('li').removeClass('selected');
$(this).addClass('selected');

var style = '';
font = $(this).find('img').attr('alt');
$('select[name=font]').val(font.toLowerCase().replace(/ /g, '-'));
variants = 'regular';

$('style.fonts').remove();
$('link[href^=http://fonts.googleapis.com]').remove();

if (font.toLowerCase() == 'diavlo')
{

} else
{
WebFont.load
({
google:
{
families: [ font.replace(/ /g,"+") + ':' + 'regular,bold' ]
}
});

$.each(font_familes, function(index, selector)
{
style += selector + ' { font-family: \'' + font + '\' !important;}';
});

$('<style />').attr('type', 'text/css').text(style).addClass('fonts').addClass('custom-rules').appendTo('head');
}

return false;
}
});

$('select[name=font]').mousedown( function()
{
$(this).next('ul.fonts').addClass('opened').removeClass('selected');
$(this).focus();

return false;
});
});

// SWITCHER END
});

threadi · 3 August 2011

Im JavaScript gibt es eine Stelle:

Code:

auto_slide: false,

Ändere die mal in

Code:

auto_slide: true,

Wenn es das nicht ist, schau ins Handbuch von jQuery.slider(), dort sollte eine vollständige Dokumentation zu finden sein.

Und das nächste Mal bitte die Code-Tags im Forum verwenden um Quellcode zu zeigen.

thomas.mueller · 4 August 2011

HTML:

(function($)
{
    $.fn.slider = function(options)
    {
        $sliders = $(this);
        
        options = $.extend
        ({
            nav: 'ul.nav',
            pagination: 'ul.pagination',
            items: 'ul.items',
            item: options.item,
            visible: 3,
            slide: 1,
            speed: 200,
            auto_width: true,
            width: null,
            wrapper_class: 'slider-wrapper',
            fade: false,
            auto_slide: true,
            auto_delay: 500,
            auto_direction: 'right',
            easing: 'swing',
            auto_height: true,
            auto_height_parent: false,
            count: null,
            on_show: null
        }, options);
        
        $sliders.each( function()
        {
            $slider = $(this);
            
            $slider_nav = $(this).children(options.nav);
            $slider_pagination = $(this).children(options.pagination);
            $slider_items = $(this).children(options.items);
                
            $slider_items.after($slider_items.clone().hide());
                
            $slider_items_content = $(this).children(options.items).eq(1);
            
            $slider_items.css
            ({
                'position': 'absolute',
                'width': 9999
            }).wrap
            (
                $('<div />').addClass(options.wrapper_class).css
                ({
                    'position': 'relative',
                    'overflow': 'hidden',
                    'height': $slider_items.outerHeight(true),
                    'width': (options.auto_width ? 'auto': options.width)
                })
            ).children(options.item).css
            ({
                'float': 'left'
            });
            
            if (options.count == null)
            {
                options.count = $slider_items.children(options.item).length;
            }
                
            $slider_items.children(options.item).remove();
            $slider_items.data('last-index', options.visible);
            
            height = 0;
            
            for (i = 0; i < options.visible; i++)
            {
                $item = $slider_items_content.children(options.item).eq(i).clone();
                
                if (options.on_show != null)
                {
                    options.on_show($item);
                }
                
                $slider_items.append($item);
                
                if (options.auto_height)
                {
                    if ($slider_items.children(options.item).last().outerHeight(true) > height)
                    {
                        height = $slider_items.children(options.item).last().outerHeight(true);
                    }
                }
            }

            if (options.auto_height && height != 0)
            {
                if (options.auto_height_parent)
                {
                    $slider_items.parent('div.' + options.wrapper_class).parent().height(height);
                } else
                {
                    $slider_items.parent('div.' + options.wrapper_class).height(height);
                }
            }
            
            slider_item = function()
            {
                $slider = $(this).data('slider');
                options = $slider.data('options');
                $slider_pagination = $slider.children(options.pagination);
                $slider_items = $slider.children('div.' + options.wrapper_class).children(options.items);                
                $slider_items_content = $slider.children(options.items);
                var item = $slider_pagination.children(options.item).index(this);
                
                if (options.count > options.visible)
                {
                    if ($slider_items.is(':not(:animated)'))
                    {
                        start_index = $slider_items.data('last-index') - 1;
                        height = 0;

                        if (item < start_index)
                        {
                            $item = $slider_items_content.children(options.item).eq(item).clone();
                            
                            if (options.on_show)
                            {
                                options.on_show($item);
                            }
                            
                            $slider_items.prepend($item);
                                
                            if (options.auto_height)
                            {
                                if ($slider_items.children(options.item).first().outerHeight(true))
                                {
                                    height = $slider_items.children(options.item).first().outerHeight(true);
                                }
                            }
                                
                            $slider_items.data('last-index', (item + 1 >= options.count ? 0 : item + 1));
                        } else if (item > start_index)
                        {
                            $item = $slider_items_content.children(options.item).eq(item).clone();
                            
                            if (options.on_show != null)
                            {
                                options.on_show($item);
                            }
                            
                            $slider_items.append($item);
                            
                            if (options.auto_height)
                            {
                                if ($slider_items.children(options.item).last().outerHeight(true))
                                {
                                    height = $slider_items.children(options.item).last().outerHeight(true);
                                }
                            }
                            
                            $slider_items.data('last-index', (item + 1 >= options.count ? 0 : item + 1));
                        }
                        
                        if (item != start_index)
                        {
                            $slider_pagination.children(options.item).removeClass('current').eq(item).addClass('current');
                            
                            if (item < start_index)
                            {
                                $slider_items.css('left', -$slider_items.children(options.item).outerWidth(true) * options.slide);
                            }
                                
                            if (options.fade)
                            {
                                if (item < start_index)
                                {
                                    $slider_items.children(options.item).last().fadeOut(options.speed);
                                } else
                                {
                                    $slider_items.children(options.item).first().fadeOut(options.speed);
                                }
                            }
                            
                            if (options.auto_height && height != 0)
                            {
                                if (options.auto_height_parent)
                                {
                                    $slider_items.parent('div.' + options.wrapper_class).parent().animate
                                    ({
                                        'height': height
                                    }, options.speed);
                                } else
                                {
                                    $slider_items.parent('div.' + options.wrapper_class).animate
                                    ({
                                        'height': height
                                    }, options.speed);
                                }
                            }
                            
;

thomas.mueller · 4 August 2011

HTML:

                            if (item < start_index)
                            {
                                $slider_items.animate
                                ({
                                    'left': '+=' + $slider_items.children(options.item).outerWidth(true) * options.slide
                                }, options.speed, options.easing, function()
                                {
                                    for (i = 0; i < options.slide; i++)
                                    {
                                        $slider_items.children(options.item).last().remove();
                                    }
                                });
                            } else
                            {
                                $slider_items.animate
                                ({
                                    'left': '-=' + $slider_items.children(options.item).outerWidth(true) * options.slide
                                }, options.speed, options.easing, function()
                                {
                                    $slider_items.css('left', 0);

                                    for (i = 0; i < options.slide; i++)
                                    {
                                        $slider_items.children(options.item).first().remove();
                                    }
                                });
                            }
                        }
                    }
                }
                    
                return false;
            }
                
            slide_left = function()
            {
                $slider = $(this).data('slider');
                options = $slider.data('options');
                $slider_nav = $slider.children(options.nav);
                $slider_pagination = $slider.children(options.pagination);
                $slider_items = $slider.children('div.' + options.wrapper_class).children(options.items);                
                $slider_items_content = $slider.children(options.items);

                if (options.count > options.visible)
                {
                    if ($slider_items.is(':not(:animated)'))
                    {
                        start_index = $slider_items.data('last-index') - options.visible - 1;
                        height = 0;
                        
                        for (i = start_index; i > start_index - options.slide ; i--)
                        {
                            if (i < 0)
                            {
                                index = $slider_items_content.children(options.item).length + i;
                            } else
                            {
                                index = i;
                            }
                            
                            $item = $slider_items_content.children(options.item).eq(index).clone();
                            
                            if (options.on_show != null)
                            {
                                options.on_show($item);
                            }
            
                            $slider_items.prepend($item);
                            
                            if (options.auto_height)
                            {
                                if ($slider_items.children(options.item).first().outerHeight(true))
                                {
                                    height = $slider_items.children(options.item).first().outerHeight(true);
                                }
                            }
                            
                            $slider_items.data('last-index', index + options.visible);
                        }
                        
                        $slider_pagination.children(options.item).removeClass('current').eq(index).addClass('current');
                        
                        $slider_items.css('left', -$slider_items.children(options.item).outerWidth(true) * options.slide);
                            
                        if (options.fade)
                        {
                            for (i =  $slider_items.children(options.item).length - 1; i >  $slider_items.children(options.item).length - options.slide - 1; i--)
                            {
                                $slider_items.children(options.item).eq(i).fadeOut(options.speed);
                            }
                        }
                        
                        if (options.auto_height && height != 0)
                        {
                            if (options.auto_height_parent)
                            {
                                $slider_items.parent('div.' + options.wrapper_class).parent().animate
                                ({
                                    'height': height
                                }, options.speed);
                            } else
                            {
                                $slider_items.parent('div.' + options.wrapper_class).animate
                                ({
                                    'height': height
                                }, options.speed);
                            }
                        }

                         $slider_items.animate
                         ({
                             'left': '+=' + $slider_items.children(options.item).outerWidth(true) * options.slide
                         }, options.speed, options.easing, function()
                         {
                             for (i = 0; i < options.slide; i++)
                             {
                                 $slider_items.children(options.item).last().remove();
                             }
                         });
                     }
                 }
                     
                 return false;
             };

thomas.mueller · 4 August 2011

HTML:

slide_right = function()
             {
                 $slider = $(this).data('slider');
                 options = $slider.data('options');
                 $slider_nav = $slider.children(options.nav);
                 $slider_items = $slider.children('div.' + options.wrapper_class).children(options.items);
                 $slider_items_content = $slider.children(options.items);
                 
                 if (options.count > options.visible)
                 {
                     if ($slider_items.is(':not(:animated)'))
                     {
                         start_index = $slider_items.data('last-index');
                         height = 0;
                         
                         for (i = start_index; i < start_index + options.slide ; i++)
                         {
                             if (i >= $slider_items_content.children(options.item).length)
                             {
                                 index = i - $slider_items_content.children(options.item).length;
                             } else
                             {
                                 index = i;
                             }
                             
                             $item = $slider_items_content.children(options.item).eq(index).clone();
                             
                             if (options.on_show != null)
                             {
                                 options.on_show($item);
                             }
                             
                             $slider_items.append($item);
                             
                             if (options.auto_height)
                             {
                                 if ($slider_items.children(options.item).last().outerHeight(true))
                                 {
                                     height = $slider_items.children(options.item).last().outerHeight(true);
                                 }
                             }
                             
                             $slider_items.data('last-index', index + 1);
                         }
                         
                         $slider_pagination.children(options.item).removeClass('current').eq(index).addClass('current');
                             
                         if (options.fade)
                         {
                             for (i = 0; i < options.slide; i++)
                             {
                                 $slider_items.children(options.item).eq(i).fadeOut(options.speed);
                             }
                         }
                         
                         if (options.auto_height && height != 0)
                         {
                             if (options.auto_height_parent)
                             {
                                 $slider_items.parent('div.' + options.wrapper_class).parent().animate
                                 ({
                                     'height': height
                                 }, options.speed);
                             } else
                             {
                                 $slider_items.parent('div.' + options.wrapper_class).animate
                                 ({
                                     'height': height
                                 }, options.speed);
                             }
                         }
 
                         $slider_items.animate
                         ({
                             'left': '-=' + $slider_items.children(options.item).outerWidth(true) * options.slide
                         }, options.speed, options.easing, function()
                         {
                             $slider_items.css('left', 0);
 
                             for (i = 0; i < options.slide; i++)
                             {
                                 $slider_items.children(options.item).first().remove();
                             }
                         });
                     }
                 }
                     
                 return false;
             };
             
             $slider.data('options', options);
             $slider_nav.children('li.prev').data('slider', $slider).click(slide_left);
             $slider_nav.children('li.next').data('slider', $slider).click(slide_right);
             
             $slider_pagination.children(options.item).data('slider', $slider).click(slider_item);
                 
             if (options.auto_slide)
             {
                 auto_timeout = setTimeout( function()
                 {
                     setInterval( function()
                     {
                         if (options.auto_direction == 'left')
                         {
                             $slider.children(options.nav).children('li.prev').click();
                         } else
                         {
                             $slider.children(options.nav).children('li.next').click();
                         }
                     }, options.auto_delay);
                     
                     clearTimeout(auto_timeout);
                 }, options.auto_delay);
             }
         });
     
         return this;
     }
 })(jQuery)

Soooo... das ist jetzt das richtige :>

Ich denk der fehler liegt hier:

HTML:

options = $.extend         ({             nav: 'ul.nav',             pagination: 'ul.pagination',             items: 'ul.items',             item: options.item,             visible: 3,             slide: 1,             speed: 200,             auto_width: true,             width: null,             wrapper_class: 'slider-wrapper',             fade: false,             auto_slide: true,             auto_delay: 500,             auto_direction: 'right',             easing: 'swing',             auto_height: true,             auto_height_parent: false,             count: null,             on_show: null         }, options);

threadi · 6 August 2011

Sorry, aber das guckt sich keiner an in dieser Masse. Zeig einen Link zu einer Testseite, damit man sich das dort anschauen kann. Hat denn die Änderung die ich oben angeregt hatte schon etwas bewirkt?

thomas.mueller · 8 August 2011

hi,

http://www.gs-makleragentur.de/

nein, es hat leider noch nicht geholfen. Wir sind aber ganz nah dran. Der Fehler muss in den Slider-Optionen liegen

HTML:

nav: 'ul.nav',             
pagination: 'ul.pagination',            
items: 'ul.items',             
item: options.item,             
visible: 3,            
slide: 1,            
speed: 200,             
auto_width: true,            
width: null,            
wrapper_class: 'slider-wrapper',             
fade: false,            
auto_slide: true,             
auto_delay: 500,            
auto_direction: 'right',            
easing: 'swing',           
auto_height: true,             
auto_height_parent: false,            
count: null,            
on_show: null

Gruß Thomas ,)

threadi · 9 August 2011

Die richtige URL lautet GS-Makleragentur und da dort die Rechtsklicksperre gesetzt wurde, kann ich leider mittels Firebug auch nichts genauer anschauen.

thomas.mueller · 9 August 2011

Die Sperre ist raus, hatte ich ganz vergessen.

Gilles · 9 August 2011

Kannst du mal bitte die Quelle posten woher du das Script hast?

thomas.mueller · 9 August 2011

ich habe das template für 15$ gekauft und bearbeitet.

Site Templates - ChilliBox. Premium HTML template. - ThemeForest

Gilles · 9 August 2011

Guck mal in die config.js

Code:

   // success stories options    success_stories:
    {
        speed: 500,
        fade: false,
        easing: 'swing'
    },
    
    // testimonials slider
    testimonials:
    {
        speed: 500,
        fade: true,
        easing: 'swing'
    },
    
    // partners
    partners:
    {
        slide: 2,
        speed: 500,
        fade: false,
        easing: 'swing'
    },
    
    // twitter widget
    twitter_widget:
    {
        speed: 500,
        visible: 5
    }

Eins von den configs müsste dann folgende Optionen kriegen:

Code:

auto_slide: true,             auto_delay: 500,             auto_direction: 'right',

Denke es ist entweder testimonials oder partner.

thomas.mueller · 9 August 2011

Habe beides getestet, geht leider nicht. :( ... wir sind aber ganz nah dran^^

Slider funktion erstellen.

thomas.mueller

Neues Mitglied

webdesigner95

Mitglied

Sempervivum

Guest

threadi

Moderator

thomas.mueller

Neues Mitglied

thomas.mueller

Neues Mitglied

threadi

Moderator

thomas.mueller

Neues Mitglied

thomas.mueller

Neues Mitglied

thomas.mueller

Neues Mitglied

threadi

Moderator

thomas.mueller

Neues Mitglied

threadi

Moderator

thomas.mueller

Neues Mitglied

Gilles

Blogger

thomas.mueller

Neues Mitglied

Gilles

Blogger

thomas.mueller

Neues Mitglied

Neueste Beiträge