Установить разные скорости перехода Css3 на div и его дочерние элементы

Я пытаюсь реализовать Slidejs на своем веб-сайте. Вот ссылка библиотеки.

То, что я хотел бы сделать, это установить другой переход скорости в функцию элемента. Вот моя структура Html:

<div id="slides" class="sliders_1">
    <div style="background:url(/images/slider/slide1.jpg) no-repeat scroll center center; background-size:100% auto;">
        <div class="slider-title">
            <h2 class="title">Title</h2>
        </div>
        <div class="slider-subtitle">
            <h3 class="subtitle">Subtitle.</h3>
        </div>
    </div>
    <div style="background:url(/images/slider/slide1.jpg) no-repeat scroll center center; background-size:100% auto;">
        <div class="slider-title">
            <h2 class="title">Title</h2>
        </div>
        <div class="slider-subtitle">
            <h3 class="subtitle">Subtitle.</h3>
        </div>
    </div>
</div>

Например, эффект слайда может занять 500 мс для фона, но я хотел бы, чтобы мои h2 и h3 имели разную скорость. H2: 600 мс и h3: 300 мс, например.

Надеюсь, я понятен :)

Обновление # 1 Вот мой javascript:

$('.sliders_1').slidesjs({
    width: 940,
    height: 588
});

Это все, что мне нужно, чтобы включить библиотеку.

Обновление # 2 Чтобы быть более конкретным, я хотел бы сначала сместить div с фоновым изображением. Во время первого перехода, могу ли я запустить другой переход к h2 и h3 с другой скоростью для каждого?

Обновление # 3 Вот jsfiddle ! То, что я хотел бы делать, работает в Firefox, но не в Safari, Chrome и других... Скорость слайда между фоном, h2 и h3 отличается и то, что я хочу.

Я бы хотел, чтобы он скользил справа налево!