Pages

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';

Thursday, January 4, 2018

get all users by first character in IONIC custom Wordpress API Function

PHP FILE


/**
* Users Listing
* Users Custom Fields, Pagination, Searching User by its first Character
*/

add_action('rest_api_init', 'wpc_register_wp_api_endpoints');
function wpc_register_wp_api_endpoints()
{
register_rest_route('userlisting', '/search', array(
'methods' => 'GET',
'callback' => 'wpc_somename_search_callback',
));
}

function wpc_somename_search_callback($request_data)
{

$parameters = $request_data->get_params();
$usersdata = array();

if (!isset($parameters['per_page']) || empty($parameters['per_page']))
return array('error' => 'Page No empty ');
$number = $parameters['per_page'];
if (isset($parameters['page']) || !empty($parameters['page'])) {
$paged = $parameters['page'];
} else {
$paged = 1;
}
if (isset($parameters['s']) || !empty($parameters['s'])) {
$search = esc_attr($parameters['s']);
} else {
$search = '';
}

$args = array(
'role' => 'author',
'exclude' => array('administrator'),
'orderby' => 'login',
'order' => 'ASC',
'search' => '',
'meta_query' => ($search!='') ? array(array('key' => 'nickname', 'value' => '^'.$search.'.*', 'compare' => 'REGEXP')) : '',
'offset' => $paged ? ($paged - 1) * $number : 1,
'number' => $number,
'fields' => array('ID','user_nicename','display_name'),
'who' => '',
);
$users = get_users($args);

foreach ($users as $user) {

$usersdata['users'][]['authormeta'] = array('ID' => $user->ID, 'display_name' => $user->display_name,
'authormetadata' => array(
'cupp_upload_meta' => get_user_meta($user->ID, 'cupp_upload_meta', true),
'description' => get_user_meta($user->ID, 'description', true),
'nickname' => get_user_meta($user->ID, 'nickname', true)
), 'arguments'=> $args,
);

}
return $usersdata;
}





/***************************************************************
*Ionic 3 Function Call
**/

// CALL the API

this.http.get('http://yourwebsite.com/wp-json/userlisting/search?per_page=15&s=Z')
.map(res => res.json())
.subscribe(data => {
// we've got back the raw data, now generate the core schedule data
console.log(data);
this.authors = data.users;
});