Pages

Tuesday, May 21, 2019

Countdown timer JS code


<section class="black-bar">
    <h4>Cash Game Fix enrollment ends in:</h4>
    <h2 class="countdown"><span class="days"></span> days <span class="line">|</span> <span class="hours"></span> hours <span class="line">|</span> <span class="minutes"></span> min <span class="line">|</span> <span class="seconds"></span> sec</h2>
</section>
<script type="text/javascript">
    /* STatic Date Timer start */

    function makeTimer() {

            // var endTime = new Date("29 April 2018 9:56:00 GMT+01:00"); 
            var endTime = new Date("24 May 2019 23:59:59 GMT-07:00");         
            endTime = (Date.parse(endTime) / 1000);

            var now = new Date();
            now = (Date.parse(now) / 1000);


            var timeLeft = endTime - now;


            var days = Math.floor(timeLeft / 86400);
            var hours = Math.floor((timeLeft - (days * 86400)) / 3600);
            var minutes = Math.floor((timeLeft - (days * 86400) - (hours * 3600 )) / 60);
            var seconds = Math.floor((timeLeft - (days * 86400) - (hours * 3600) - (minutes * 60)));


            $clock = $('h2.countdown');
            $days = $clock.find('.days');
            $hours = $clock.find('.hours');
            $minutes = $clock.find('.minutes');
            $seconds = $clock.find('.seconds');

            if(days < 0) days = 0;

            if(hours < 0) hours = 0;

            if(minutes < 0) minutes = 0;

            if(seconds < 0) seconds = 0;

            // If lower than 10, then add 0;
            if( days < 10 ) $days.html('0' + days);
            if( hours < 10 ) $hours.html('0' + hours);
            if( minutes < 10 ) $minutes.html('0' + minutes);
            if( seconds < 10 ) $seconds.html('0' + seconds);

            // If higher than don't add anything.
            if( days > 10 ) $days.html(days);
            if( hours > 10 ) $hours.html(hours);
            if( minutes > 10 ) $minutes.html(minutes);
            if( seconds > 10 ) $seconds.html(seconds);

            if (timeLeft <= 0) {
                clearInterval(makeTimer());
            }

    }
    $(document).ready(function(){
        setInterval(function() { makeTimer(); }, 1000);   
    })
   
</script>
    

Wednesday, March 27, 2019

Scroll inside of the div upto fixed height scroll





/**
* App Features Scroll JS
*/

// $('.sec-inner--appFeatures .left-col').bind('mousewheel DOMMouseScroll', function (event) {
//     event.preventDefault();
//     total = $(".sec-inner--appFeatures .left-col").find('.mediaObject').length;
//     h = $(".sec-inner--appFeatures .left-col").height();
//     scroll(event, h, total);
// });
<div class="left-col tabs">
                            <a class="tab mediaObject mediaObject--md mediaObject--purple">
                                <div class="mediaObject__body">
                                    <div class="mediaObject__body__copy">
                                        <h2 class="mediaObject__title">Chumash with Rashi</h2>
                                        <p class="mediaObject__para">The daily learning of Chumash with Rashi is one of
                                            the three daily
                                            regimens which make up the learning of Chitas.</p>
                                    </div>
                                    <div class="mediaObject__body__img">
                                        <img src="img/feldheim_blank_1.png" alt="">
                                    </div>
                                </div>
                            </a>
                            <!-- ./mediaObject -->
                            <a class="tab mediaObject mediaObject--md mediaObject--orange">
                                <div class="mediaObject__body">
                                    <div class="mediaObject__body__copy">
                                        <h2 class="mediaObject__title">Chumash with Rashi</h2>
                                        <p class="mediaObject__para">The daily learning of Chumash with Rashi is one of
                                            the three daily
                                            regimens which make up the learning of Chitas.</p>
                                    </div>
                                    <div class="mediaObject__body__img">
                                        <img src="img/feldheim_blank_1.png" alt="">
                                    </div>
                                </div>
                            </a>
                            <!-- ./mediaObject -->
                            <a class="tab mediaObject mediaObject--md mediaObject--seaBlue">
                                <div class="mediaObject__body">
                                    <div class="mediaObject__body__copy">
                                        <h2 class="mediaObject__title">Chumash with Rashi</h2>
                                        <p class="mediaObject__para">The daily learning of Chumash with Rashi is one of
                                            the three daily
                                            regimens which make up the learning of Chitas.</p>
                                    </div>
                                    <div class="mediaObject__body__img">
                                        <img src="img/Kehot.png" alt="">
                                    </div>
                                </div>
                            </a>
                            <!-- ./mediaObject -->
                            <a class="tab mediaObject mediaObject--md mediaObject--lightGreen">
                                <div class="mediaObject__body">
                                    <div class="mediaObject__body__copy">
                                        <h2 class="mediaObject__title">Chumash with Rashi</h2>
                                        <p class="mediaObject__para">The daily learning of Chumash with Rashi is one of
                                            the three daily
                                            regimens which make up the learning of Chitas.</p>
                                    </div>
                                    <div class="mediaObject__body__img">
                                        <img src="img/Kehot.png" alt="">
                                    </div>
                                </div>
                            </a>
                            <!-- ./mediaObject -->
                            <a class="tab mediaObject mediaObject--md mediaObject--darkGreen">
                                <div class="mediaObject__body">
                                    <div class="mediaObject__body__copy">
                                        <h2 class="mediaObject__title">Chumash with Rashi</h2>
                                        <p class="mediaObject__para">The daily learning of Chumash with Rashi is one of
                                            the three daily
                                            regimens which make up the learning of Chitas.</p>
                                    </div>
                                    <div class="mediaObject__body__img">
                                        <img src="img/Untitffled-3.png" alt="">
                                    </div>
                                </div>
                            </a>
                            <!-- ./mediaObject -->
                            <a class="tab mediaObject mediaObject--md mediaObject--seaGreen">
                                <div class="mediaObject__body">
                                    <div class="mediaObject__body__copy">
                                        <h2 class="mediaObject__title">Chumash with Rashi</h2>
                                        <p class="mediaObject__para">The daily learning of Chumash with Rashi is one of
                                            the three daily
                                            regimens which make up the learning of Chitas.</p>
                                    </div>
                                    <div class="mediaObject__body__img">
                                        <img src="img/Untitffled-3.png" alt="">
                                    </div>
                                </div>
                            </a>
                            <!-- ./mediaObject -->
                            <a class="tab mediaObject mediaObject--md mediaObject--yellow">
                                <div class="mediaObject__body">
                                    <div class="mediaObject__body__copy">
                                        <h2 class="mediaObject__title">Chumash with Rashi</h2>
                                        <p class="mediaObject__para">The daily learning of Chumash with Rashi is one of
                                            the three daily
                                            regimens which make up the learning of Chitas.</p>
                                    </div>
                                    <div class="mediaObject__body__img">
                                        <img src="img/artscrollbw1.png" alt="">
                                    </div>
                                </div>
                            </a>
                            <!-- ./mediaObject -->
                            <a class="tab mediaObject mediaObject--md mediaObject--royalBlue">
                                <div class="mediaObject__body">
                                    <div class="mediaObject__body__copy">
                                        <h2 class="mediaObject__title">Chumash with Rashi</h2>
                                        <p class="mediaObject__para">The daily learning of Chumash with Rashi is one of
                                            the three daily
                                            regimens which make up the learning of Chitas.</p>
                                    </div>
                                    <div class="mediaObject__body__img">
                                        <img src="img/artscrollbw1.png" alt="">
                                    </div>
                                </div>
                            </a>
                        </div>



// $('.sec-inner--appFeatures .left-col').on('scroll', function (event) {
//     $('.sec-inner--appFeatures .left-col').bind('mousewheel DOMMouseScroll', function (event) {
//         event.preventDefault();
//         total = $(".sec-inner--appFeatures .left-col").find('.mediaObject').length;
//         h = $(".sec-inner--appFeatures .left-col").height();
//         scroll(event, h, total);
//     });
// });

// var num = 0;
// var scrolling = false;

// function scroll(event, h, total) {
//     event.preventDefault();

//     // For 6 Items per block
//     count = Math.ceil(total / 6);

//     // For 4 Items per block
//     // count = Math.ceil(total / 4);

//     if (!scrolling) {
//         scrolling = true;

//         if (event.originalEvent.wheelDelta > 0 || event.originalEvent.detail < 0) {
//             num--;
//             num = num < 1 ? 0 : num;
//             hight_offset = num < 1 ? 0 : h * num;
//         } else {
//             if (num < count - 1) { num++; } num = num >= count ? count : num;
//             hight_offset = num > count ? num * h : (h) * num;
//         }

//         // console.log("hight_offset: "+hight_offset +" height:"+ h +" count: "+count+" Total:"+total+" Num:"+num);

//         $('.sec-inner--appFeatures .left-col').animate({
//             scrollTop: (hight_offset)
//         }, 500, "linear", function () {
//             scrolling = false;

//         });

//         if (num == parseInt(count - 1)) {
//             $(".sec-inner--appFeatures .left-col").unbind("mousewheel");
//             $(".sec-inner--appFeatures .left-col").bind("mousewheel");

//         } else if (num == 0) {
//             $(".sec-inner--appFeatures .left-col").unbind("mousewheel");
//             $(".sec-inner--appFeatures .left-col").bind("mousewheel");

//         } else {
//             bindSection();

//         }
//     }
// }

// function bindSection() {
//     $('.sec-inner--appFeatures .left-col').bind('mousewheel DOMMouseScroll', function (event) {
//         event.preventDefault();
//         total = $(".sec-inner--appFeatures .left-col").find('.mediaObject').length;
//         h = $(".sec-inner--appFeatures .left-col").height();
//         scroll(event, h, total);
//     })
// };

Sunday, December 9, 2018

Scroll To Top Jquery Function and html

<script>
$(window).scroll(function() {
    if ($(window).scrollTop() > 100) {
        // > 100px from top - show div
      $('.scrollBtn').show();

    }
    else {
        // <= 100px from top - hide div
      $('.scrollBtn').hide();
    }
});
$("#button").click(function() {
   $('html, body').animate({
        scrollTop: $("header").offset().top
    }, 2000);
});$
</script>
<div class="scrollBtn" style="display: none;"> <
a href="javascript:;" id="scrollButton"><img src="images/arrowUp.png"></a>
</div>

<style>
.scrollBtn {
position: fixed; 
right: 20px; 
bottom: 20px; 
width: 40px; 
height: 40px; 
z-index: 10;}
.scrollBtn img {width: 100%; }
</style>

Wednesday, December 5, 2018

Random Color return in PHP function


function random_background_image(){
$rand = array('0', '1', '2', '3', '4', '5', '6', '7', '8', '9', 'a', 'b', 'c', 'd', 'e', 'f');
return $color = '#'.$rand[rand(0,15)].$rand[rand(0,15)].$rand[rand(0,15)].$rand[rand(0,15)].$rand[rand(0,15)].$rand[rand(0,15)]."45";
}

// function call
echo random_background_image();

Sunday, December 2, 2018

Redirect Domain and its all urls to you New domain using .htaccess


Using .htacess you can redirect the domain or page or link into your own or even can change the url of your domain in the .htaccess file.

Here is simple example to redirect the old domain to new domain in the .htaccess file

Permanant Redirect (301)

Syntax:
-------------------------------------------------------------------------------------
Redirect 301 / https://yourdomain.com/
Redirect 301 https://yourolddomain.com/ https://yournewdomain.com/

Tuesday, November 20, 2018

owl Carousel Settings

<div class="owl-carousel slider-section" id="owlslide">

<?php while(the_repeater_field('banner_slider')): ?>

<div class="item bestcenter vidHide" id="myVideo" <?php if (get_sub_field('banner_backgound_video') ){?> data-videosrc="<?php the_sub_field('banner_backgound_video'); ?>" <?php } ?> >

<?php if (get_sub_field('banner_backgound_video')) { /* ?><img class="loadingImg" src="<?php echo get_template_directory_uri(); ?>/assets/img/loading.gif"> <?php */ } ?>

<div class="preloader preloader-out" style="background-color: #FFFFFF"><div class="loader"></div></div>

<?php if(get_sub_field('banner_background_mobile_image')) { ?>
<img class="showinMobile" src='<?php the_sub_field('banner_background_mobile_image'); ?>'/>
<?php } ?>

<?php if(get_sub_field('banner_background_imag')) { ?>
<img class="hideinMobile" src='<?php the_sub_field('banner_background_imag'); ?>'/>
<?php } ?>

<div class='promo-container'>

<div class="container">

<div class="row align-items-center justify-content-center">

<div class="col-lg-6">

<div class="slider-left-content">

<h4><?php the_sub_field('banner_main_heading'); ?> <span><?php the_sub_field('banner_sub_heading'); ?></span></h4>

</div>

</div>

<div class="col-lg-3">

<div class="slider-right-btn">

<a href="<?php the_sub_field(' banner_button_link'); ?>" class="custom-btn"><?php the_sub_field('banner_button_text'); ?></a>

</div>

</div>

</div>

</div>

</div>

</div>

<?php endwhile; ?>

</div>



<script>
if ($('.slider-section').length > 0) {

var owl = $('.slider-section');

owl.owlCarousel({

loop: true,

margin: 10,

nav: true,

navText: ["<img src='/wp-content/themes/parasailsiesta/assets/img/slider-arrow-left.png'>", "<img src='/wp-content/themes/parasailsiesta/assets/img/slider-arrow-right.png'>"],

dots: true,

items: 1

})

// owl.on('initialize.owl.carousel initialized.owl.carousel ' +
// 'initialize.owl.carousel initialize.owl.carousel ' +
// 'resize.owl.carousel resized.owl.carousel ' +
// 'refresh.owl.carousel refreshed.owl.carousel ' +
// 'update.owl.carousel updated.owl.carousel ' +
// 'drag.owl.carousel dragged.owl.carousel ' +
// 'translate.owl.carousel translated.owl.carousel ' +
// 'to.owl.carousel changed.owl.carousel', function( event ){
// console.log( event.type +' TESTING ');
// $('.preloader').hide();

// });

owl.on('refreshed.owl.carousel ', function( event ){
console.log( event.type +' TESTING ');
setTimeout(() => {
$('.preloader').hide();
}, 2000);

});
// Trigger function on owl.carousel Refreshed/Loaded
owl.trigger('refreshed.owl.carousel');

if (!isMobile(1367)) {

$('.owl-item .item').each(function () {

var attr = $(this).attr('data-videosrc');
if (typeof attr !== typeof undefined && attr !== false) {

console.log('hit');

var videosrc = $(this).attr('data-videosrc');

$(this).prepend('<video muted><source src="' + videosrc + '" type="video/mp4"></video>');
$('.owl-item video').attr('autoplay', true).attr('loop', true).attr('poster','https://www.parasailsiesta.com/wp-content/uploads/2018/11/slider-1-min.jpg');

}

});


}







function isMobile(width) {

if (width == undefined) {

width = 719;

}

if (window.innerWidth <= width) {

return true;

} else {

return false;

}

}



$('.lazy').Lazy({

// your configuration goes here

scrollDirection: 'vertical',

effect: 'fadeIn',

visibleOnly: true,

onError: function(element) {

console.log('error loading ' + element.data('src'));

}

});


(function($) {

$.Lazy('.vidHide', ['audio', 'video'], function(element, response) {

// this plugin will automatically handle '<audio>' and '<video> elements,

// even when no 'data-loader' attribute was set on the elements

});

})(window.jQuery || window.Zepto);

}
</script>

Friday, September 7, 2018

Laravel Server.php File Solution


$uri = parse_url($_SERVER['REQUEST_URI'], PHP_URL_PATH);

$uri = urldecode($uri);

// $paths = require __DIR__.'/bootstrap/paths.php';

$requested = __DIR__.'/public'.$uri;

// This file allows us to emulate Apache's "mod_rewrite" functionality from the
// built-in PHP web server. This provides a convenient way to test a Laravel
// application without having installed a "real" web server software here.
if ($uri !== '/' and file_exists($requested))
{
return false;
}

require_once __DIR__.'/public/index.php';