Testwiese

Benchmark created on

Preparation HTML

<script type="text/javascript" src="//ruhrmedien.de/wiesemobile/v2/assets/js/jquery.js"></script>
                <script type="text/javascript" src="//ruhrmedien.de/wiesemobile/v2/assets/js/mobile.js"></script>
                <script type="text/javascript" src="//ruhrmedien.de/wiesemobile/v2/assets/js/scrollintoview.min.js"></script>
                <script type="text/javascript" src="//ruhrmedien.de/wiesemobile/v2/assets/js/lightbox-2.6.min.js"></script>
                
                <link rel="stylesheet" type="text/css" href="//ruhrmedien.de/wiesemobile/v2/assets/css/mobile.css" />
                <link rel="stylesheet" href="//ruhrmedien.de/wiesemobile/v2/assets/css/lightbox.css" />
                <div id="header"></div>
                
                <div id="Content">
                        <div class="toggler" data-div=".mode" style="background: url(assets/images/bgs/mode.jpg);">
                                <span class="toggler_text">Mode</span>
                        </div>
                        <div class="toToggle mode">
                                <div class="toggler subToggler" data-div=".subDamen">
                                        <span class="toggler_text_sub">Damen</span>
                                </div>
                                <div class="toToggle subDamen">
                                        <div class="toToggleContent_sub">
                                                <a      href="assets/images/mode/damen/modern_classic_barclay_big.jpg"
                                                        data-lightbox="image-1" title="Modern Classic - Barclay">
                                                        
                                                        <img class="lightImg" src="assets/images/mode/damen/modern_classic_barclay.jpg"/>
                                                </a>
                                                
                                                <a      href="assets/images/mode/damen/modern_woman_tomtailor_big.jpg"
                                                        data-lightbox="image-2" title="Modern Woman - Tom Tailor">
                                                        
                                                        <img class="lightImg" src="assets/images/mode/damen/modern_woman_tomtailor.jpg"/>
                                                </a>
                                                
                                                <a      href="assets/images/mode/damen/premium_fashion_marcopolo_big.jpg"
                                                        data-lightbox="image-2" title="Premium Fashion - Marcopolo">
                                                        
                                                        <img class="lightImg" src="assets/images/mode/damen/premium_fashion_marcopolo.jpg"/>
                                                </a>
                                                
                                                <a      href="assets/images/mode/damen/young_fashion_gipsy_big.jpg"
                                                        data-lightbox="image-2" title="Young Fashion - Gipsy">
                                                        
                                                        <img class="lightImg" src="assets/images/mode/damen/young_fashion_gipsy.jpg"/>
                                                </a>
                                        </div>
                                </div>
                                
                                <div class="toggler subToggler" data-div=".subHerren">
                                        <span class="toggler_text_sub">Herren</span>
                                </div>
                                <div class="toToggle subHerren">
                                        <div class="toToggleContent_sub">
                                                <a      href="assets/images/mode/herren/premium_man_gaastra_big.jpg"
                                                        data-lightbox="image-1" title="Premium Man - Gaastra">
                                                        
                                                        <img class="lightImg" src="assets/images/mode/herren/premium_man_gaastra.jpg"/>
                                                </a>
                                                
                                                <a      href="assets/images/mode/herren/premium_man_gant_big.jpg"
                                                        data-lightbox="image-2" title="Premium Man - Gant">
                                                        
                                                        <img class="lightImg" src="assets/images/mode/herren/premium_man_gant.jpg"/>
                                                </a>
                                                
                                                <a      href="assets/images/mode/herren/premium_man_hilfiger_big.jpg"
                                                        data-lightbox="image-2" title="Premium Man - Hilfiger">
                                                        
                                                        <img class="lightImg" src="assets/images/mode/herren/premium_man_hilfiger.jpg"/>
                                                </a>
                                                
                                                <a      href="assets/images/mode/herren/young_man_scotchsoda_big.jpg"
                                                        data-lightbox="image-2" title="Young Man - Scotchsoda">
                                                        
                                                        <img class="lightImg" src="assets/images/mode/herren/young_man_scotchsoda.jpg"/>
                                                </a>
                                        </div>
                                </div>
                                
                                <div class="toggler subToggler" data-div=".subKinder">
                                        <span class="toggler_text_sub">Kinder</span>
                                </div>
                                <div class="toToggle subKinder">
                                        <div class="toToggleContent_sub">
                                                <a      href="assets/images/mode/kinder/baby_kanz_big.jpg"
                                                        data-lightbox="image-1" title="Baby - Kanz">
                                                        
                                                        <img class="lightImg" src="assets/images/mode/kinder/baby_kanz.jpg"/>
                                                </a>
                                                
                                                <a      href="assets/images/mode/kinder/kids_lego_big.jpg"
                                                        data-lightbox="image-2" title="Kids - Lego">
                                                        
                                                        <img class="lightImg" src="assets/images/mode/kinder/kids_lego.jpg"/>
                                                </a>
                                                
                                                <a      href="assets/images/mode/kinder/junior_garcia_big.jpg"
                                                        data-lightbox="image-2" title="Junior - Garcia">
                                                        
                                                        <img class="lightImg" src="assets/images/mode/kinder/junior_garcia.jpg"/>
                                                </a>
                                                
                                                <a      href="assets/images/mode/kinder/bademode_arena_big.jpg"
                                                        data-lightbox="image-2" title="Bademode - Arena">
                                                        
                                                        <img class="lightImg" src="assets/images/mode/kinder/bademode_arena.jpg"/>
                                                </a>
                                        </div>
                                </div>
                                
                                <div class="toggler subToggler" data-div=".subDessous">
                                        <span class="toggler_text_sub">Dessous</span>
                                </div>
                                <div class="toToggle subDessous">
                                        <div class="toToggleContent_sub">
                                                <a      href="assets/images/mode/dessous/dessous_beedees_big.jpg"
                                                        data-lightbox="image-1" title="Dessous - Beedees">
                                                        
                                                        <img class="lightImg" src="assets/images/mode/dessous/dessous_beedees.jpg"/>
                                                </a>
                                                
                                                <a      href="assets/images/mode/dessous/dessous_mey_big.jpg"
                                                        data-lightbox="image-2" title="Dessous - Mey">
                                                        
                                                        <img class="lightImg" src="assets/images/mode/dessous/dessous_mey.jpg"/>
                                                </a>
                                                
                                                <a      href="assets/images/mode/dessous/dessous_passionata_big.jpg"
                                                        data-lightbox="image-2" title="Dessous - Passionata">
                                                        
                                                        <img class="lightImg" src="assets/images/mode/dessous/dessous_passionata.jpg"/>
                                                </a>
                                                
                                                <a      href="assets/images/mode/dessous/dessous_ninavonc_big.jpg"
                                                        data-lightbox="image-2" title="Dessous - Ninavonc">
                                                        
                                                        <img class="lightImg" src="assets/images/mode/dessous/dessous_ninavonc.jpg"/>
                                                </a>
                                        </div>
                                </div>
                        </div>
                
                        <div class="toggler" data-div=".service" style="background: url(assets/images/bgs/service.jpg);">
                                <span class="toggler_text">Service</span>
                        </div>
                        <div class="toToggle service">
                                <div class="toToggleContent">
                                        Service Content
                                </div>
                        </div>
                
                        <div class="toggler" data-div=".events" style="background: url(assets/images/bgs/events.jpg);">
                                <span class="toggler_text">Events</span>
                        </div>
                        <div class="toToggle events">
                                <div class="toToggleContent">
                                        Events Content
                                </div>
                        </div>
                
                        <div class="toggler" data-div=".about" style="background: url(assets/images/bgs/about.jpg);">
                                <span class="toggler_text">Über uns</span>
                        </div>
                        <div class="toToggle about">
                                <div class="toToggleContent">
                                        Über uns Content
                                </div>
                        </div>
                
                        <div class="toggler" data-div=".kontakt" style="background: url(assets/images/bgs/kontakt.jpg);">
                                <span class="toggler_text">Kontakt</span>
                        </div>
                        <div class="toToggle kontakt">
                                <div class="toToggleContent">
                                        Kontakt Content
                                </div>
                        </div>
                
                        <div class="toggler" data-div=".anfahrt" style="background: url(assets/images/bgs/anfahrt.jpg);">
                                <span class="toggler_text">Anfahrt</span>
                        </div>
                        <div class="toToggle anfahrt">
                                <div class="toToggleContent">
                                        Anfahrt Content
                                </div>
                        </div>
                
                        <div class="toggler" data-div=".impressum" style="background: url(assets/images/bgs/impressum.jpg);">
                                <span class="toggler_text">Impressum</span>
                        </div>
                        <div class="toToggle impressum">
                                <div class="toToggleContent">
<br /><strong>Impressum und rechtliche Hinweise</strong><br />
Anbieter nach § 6 MDStV und verantwortlich für den Inhalt dieser Seiten: <br />
Mensing Detmold Textilhandel GmbH Lange Straße 20-24 32756 Detmold <br />

<br />Registergericht: Amtsgericht Lemgo<br />
Handelsregisternummer: HRB 7054<br />
Geschäftsführer: André Gunselmann<br />

<br />Haftungsausschluß<br />
Diese Website dient lediglich der Information. Der Anbieter hat mit gebührender Sorgfalt und Wissen den Inhalt dieser Site zusammengestellt, übernimmt aber keine Garantie, weder ausdrücklich oder impliziert, für die Art oder Richtigkeit des Website-Materials und übernimmt keine Haftung (einschließlich Haftung für indirekten Verlust oder Gewinn- oder Umsatzverluste) bezüglich des Materials oder Inhalts bzw. der Nutzung dieses Materials oder Inhalts. 
Der Anbieter möchte ausdrücklich darauf hinweisen, dass er keinerlei Einfluss auf die Gestaltung und die Inhalte gelinkter Seiten hat. Deshalb distanziert sie sich ausdrücklich von allen Inhalten aller gelinkten Seiten auf dieser Homepage und macht sich diese Inhalte nicht zu Eigen. 

<br />Urheberrechtshinweise<br />
Alle auf diesen Seiten genannten Firmennamen, Logos und/oder Produktbezeichungen sind ggf. geschützt oder Warenzeichen der jeweiligen Firmen. 
Alle auf dieser Website veröffentlichten Beiträge und Abbildungen sind urheberrechtlich geschützt. Jede vom Urheberrechtsgesetz nicht zugelassene Verwertung bedarf vorheriger schriftlicher Zustimmung der Urheber. Dies gilt insbesondere für Vervielfältigung, Verbreitung, öffentliche Wiedergabe, Bearbeitung, Übersetzung, Einspeicherung, Verarbeitung bzw. Wiedergabe von Inhalten in Datenbanken oder anderen elektronischen Medien und Systemen. Fotokopien, Downloads, Web-Seiten und Verwendungen jeglicher Art dürfen nur zum persönlichen, privaten Gebrauch hergestellt werden. 

<br />Haftungsfreistellung<br />
Mit der Nutzung dieser Website erklären Sie sich damit einverstanden, den Anbieter von jeglicher Haftung, jeglichem Anspruch und jeglicher finanzieller Forderung freizustellen. Diese Erklärung umfasst unter anderem Anwaltskosten, die von Dritten wegen oder bedingt durch den von Ihnen unterbreiteten, veröffentlichten oder übermittelten Inhalt, durch die Nutzung dieser Website, durch die Verbindung zu dieser Website oder durch die Verletzung irgendwelcher Rechte einer anderen natürlichen oder juristischen Person entstehen. 

<br />Konzept, Layout, Hosting und technische Betreuung<br /> 

<br />Ruhr Medien<br />
Katernberger Straße 146-152<br />
45327 Essen<br />

<br />Telefon: +49 | 201 36599 - 137<br />
Telefax: +49 | 201 36599 - 233<br />

<br />Ansprechpartner<br />
Technik und Administration:<br />

<br />Gert Henning / Adnan Broqi<br /><br />

                                </div>
                        </div>
                </div>

Test runner

Ready to run.

Testing in
TestOps/sec
Snip
$(function()
{
        $("#Content").css( "height", ($(window).height() - $("#header").height()) + "px" );
        var height = $(window).height();

        $(".toggler").click( function(e)
        {
                $menu           = $(this);
                $submenu        = $( $menu.data("div") );
                $lengthSub      = -1;
                
                if( $menu.hasClass("open") ) {
                        $( $menu.data("div") + " .toggler" ).each( function() {
                                if( $(this).hasClass("open") )
                                        $lengthSub += 1;
                        });
                        
                        if( $lengthSub == -1 ) {
                                $submenu.slideToggle();
                                $menu.removeClass("open");
                                return;
                        }
                        
                        $( $menu.data("div") + " .toggler" ).each( function(index, element) {
                                if( $(this).hasClass("open") ) {
                                        $( $(this).data("div") ).slideToggle( function() {
                                                if( $lengthSub == index ) {
                                                        $submenu.slideToggle();
                                                        $menu.removeClass("open");
                                                }
                                        });
                                        $(this).removeClass("open");
                                }
                        });
                } else {
                        $submenu.slideToggle();
                        $submenu.scrollintoview();
                        $menu.addClass("open");
                }
        });
});
ready
Snip2
$(function()
{
        $("#Content").css( "height", ($(window).height() - $("#header").height()) + "px" );
        var height = $(window).height();

        $(".toggler").click( function(e)
        {
                $menu           = $(this);
                $submenu        = $( $menu.data("div") );
                $lengthSub      = -1;
                
                if( $menu.hasClass("open") ) {
                        $( $menu.data("div") + " .toggler" ).each( function() {
                                if( $(this).hasClass("open") )
                                        $lengthSub += 1;
                        });
                        
                        if( $lengthSub == -1 ) {
                                $submenu.slideToggle();
                                $menu.removeClass("open");
                                return;
                        }
                        
                        $( $menu.data("div") + " .toggler" ).each( function(index, element) {
                                if( $(this).hasClass("open") ) {
                                        $( $(this).data("div") ).slideToggle( function() {
                                                if( $lengthSub == index ) {
                                                        $submenu.slideToggle();
                                                        $menu.removeClass("open");
                                                }
                                        });
                                        $(this).removeClass("open");
                                }
                        });
                } else {
                        $submenu.slideToggle();
                        $submenu.scrollintoview();
                        $menu.addClass("open");
                }
        });
});
ready

Revisions

You can edit these tests or add more tests to this page by appending /edit to the URL.