Pages

bootstrap change active tab on page reload

  <script>
  $('.nav-tabs-custom a').click(function(e) {
  e.preventDefault();
  $(this).tab('show');
});

// store the currently selected tab in the hash value
$("ul.nav-tabs > li > a").on("shown.bs.tab", function(e) {
  var id = $(e.target).attr("href").substr(1);
  window.location.hash = id;
});

// on load of the page: switch to the currently selected tab
var hash = window.location.hash;
$('.nav-tabs-custom a[href="' + hash + '"]').tab('show');
  </script>

Redirect .php files to no extention

RewriteCond %{REQUEST_FILENAME}.php -f
RewriteRule !.*\.php$ %{REQUEST_FILENAME}.php [QSA,L]

# browser requests PHP
RewriteCond %{THE_REQUEST} ^[A-Z]{3,9}\ /([^\ ]+)\.php
RewriteRule ^/?(.*)\.php$ /$1 [L,R=301]

# check to see if the request is for a PHP file:
RewriteCond %{REQUEST_FILENAME}\.php -f
RewriteRule ^/?(.*)$ /$1.php [L]

slick slider horizontal scroll with mouse wheel js

<script src="js/mousewheel.js"></script>
<script src="slick/slick.min.js" type="text/javascript"></script>
        <script>
            $('.slickc').slick({
            })
                    .on("mousewheel", function (event) {
                        event.preventDefault();
                        if (event.deltaX > 0 || event.deltaY < 0) {
                            $(this).slick("slickNext");
                        } else if (event.deltaX < 0 || event.deltaY > 0) {
                            $(this).slick("slickPrev");
                        }
                    });
        </script>

Using Waypoints js on a web page - example

<script>

    var $imga = $('#mimg');

    $imga.waypoint(function (direction) {
        if (direction === 'down') {



            $('#mimg').removeClass('animated bounceOutRight');
            $('#mimg').addClass('animated fadeIn');

            $('.banny').removeClass('animated bounceOutLeft');
            $('.banny').addClass('animated fadeIn');

//            $('.ptextxs').textillate({
//                in: {effect: 'fadeInDown'}
//            });

        }
        else {
            $('#mimg').removeClass('animated  fadeIn');
            $('#mimg').addClass('animated bounceOutRight');


            $('.banny').removeClass('animated fadeIn');
            $('.banny').addClass('animated bounceOutLeft');
        }
    },
            {offset: '65%'});







</script>

Using fonts with :before css as icon bullets

Using font awesome fonts with :before css as icon bullets

ul.downlistkn li a:before {

  content: "\f21b"; /* FontAwesome Unicode */
  font-family: FontAwesome;
  display: inline-block;
  width: 1.5em; 
  font-size: 20px;
  margin-left: 5px;

}

Search This Blog