JSFiddle

  • Responsive Nav

    Example of responsive nav

    <aside>
        <header>
            <img src="http://www.timur.ca/july2013/logo.png" alt="logo" />
            <h1>Timur Ochakovsky</h1>
            <h2>Front-end developer from Toronto, Canada</h2>
        </header>
        <nav>
            <ul>
                <li> <a href="#">Home</a></li>
                <li> <a href="#">Photos</a></li>
                <li> <a href="#">Resources</a></li>
                <li> <a href="#">Projects</a></li>
            </ul>
            <select onchange="window.location.href=this.value;">
    			<option value="#"> Page 1</option>
    			<option value="#"> Page 2</option>
    			<option value="#"> Page 3</option>
    			<option value="#"> Page 4</option>
    			<option value="#"> Page ...</option></select></nav></aside>
  • Vertical NAV with sliding hover #21 is the latest revision

    jQuery 1.7.2, HTML, CSS, JavaScript

    <ul class="module">
        <li><a href="#">Page 1</a></li>
        <li><a href="#">Page 2</a></li>
        <li><a href="#">Page 3</a></li>
        <li><a href="#">Page 4</a></li>
        <li><a href="#">Page 5</a></li>
    </ul>    
  • Vertical NAV with sliding hover

    jQuery 1.7.2, HTML, CSS, JavaScript

    jQuery('ul li a').hover(function() {
        jQuery('a').removeClass('active');
        jQuery(this).addClass('active');
    });
  • Horizontal NAV with sliding hover #2 is the latest revision

    jQuery 1.7.2, HTML, CSS, JavaScript

    // insert slider
    $('ul').append('<div id="slider"></div>');
    
    // initially reset
    var left = $('ul li:first-child a').parent().position().left;
    var width = $('ul li:first-child ...
  • segmentation for provinces #case #break #default

    jQuery 1.9.1, HTML, CSS, JavaScript

    $(function() {
    	
    	// CONTENT SEGMENTATION
    	
    	// ifxSetCookie('language','en')                    
    	// ifxSetCookie('province','MB')                    
    	// var currentLanguage = ifxGetCookie('language'); 
    		
    	var currentProvince = ifxGetCookie('province');
    	// alert(currentProvince);
        
    	
    	switch ...
  • find a string of text and change its URL #1 is the latest revision

    jQuery 1.9.1, HTML, CSS, JavaScript

    $('div#upgradeMyDevice').children().find(":contains('Upgrade my existing phone')").attr('href', 'http://www.t-mobile.com');
  • find a string of text on a page

    No-Library (pure JS), HTML, CSS, JavaScript

    //EN
    $('div#mediaGallery').children().find(":contains('No charge on shipping')").remove();
    
    //FR
    $('div#mediaGallery').children().find(":contains('Aucuns frais d ...
  • Target some Provinces and remove a div on a specific page #5 is the latest revision

    No-Library (pure JS), HTML, CSS, JavaScript

    var Province = ifxGetCookie('province');
                if((Province=='YT') || (Province=='NU') || (Province=='NT')) {
    				
    				if(window.location.href.indexOf("wirelessBuyFlow") > 0){
    
    						$('#priceSection').remove();
    				}	
    
                }	 
  • re-size a video #3 is the latest revision

    jQuery 1.8.3, HTML, CSS, JavaScript

    $("#VideoSizeToggler").toggle(function() {
       $("#VideoOverviewCon").animate({'height':'471px', 'width':'810px'}, 500);
    }, function() {
    	$("#VideoOverviewCon").animate({'height':'157px', 'width':'270px'}, 500);
    });
  • Target & empty a div

    jQuery 1.8.3, HTML, CSS, JavaScript

    $("#containerTab1 .tblBorder").empty().html('NEW content');