Posts

Showing posts from October, 2018

Add First , Second, Third and Fourth class sequence wise in repeated elements

var nodes = $('.team__item').length;   for(i=0; i<nodes; i+=4) {     $('.team__item').eq(i).find('.team__bio').addClass('first');   }   for(i=1; i<nodes; i+=4) {     $('.team__item').eq(i).find('.team__bio').addClass('second');   }   for(i=2; i<nodes; i+=4) {     $('.team__item').eq(i).find('.team__bio').addClass('third');   }   for(i=3; i<nodes; i+=4) {     $('.team__item').eq(i).find('.team__bio').addClass('fourth');   }
Post a Comment
Read more

how to play and stop Vimeo video in iframe when click

Html ============= <script src="http://a.vimeocdn.com/js/froogaloop2.min.js"></script> <iframe id="vimeo-player" src="http://player.vimeo.com/video/40977539?api=1" width="400" height="225" frameborder="0" webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe> <a id="stop" href="#">STOP</a> <a id="play" href="#">PLAY</a> Jquery =========== var iframe = $('#vimeo-player')[0]; var player = $f(iframe); $('#stop').click(function() {     alert('stoped');     player.api('pause'); }); $('#play').click(function(){     alert('play');     player.api('play'); }) ================================================= Example - http://jsfiddle.net/zimm/8CV2S/14/
Post a Comment
Read more

Author list

{% set my_topics = blog_authors('default', 10) %} {% for item in my_topics %} <div class="custom-author-group">        <a href="{{ group.absolute_url }}/author/{{item.slug}}">            <span class="author-image">                {% if item.avatar %}                    <img alt="{{ item.display_name }}" src="{{ item.avatar }}">                    {% else %}                    <img src="//cdn2.hubspot.net/hubfs/2741985/Duck%20Creek%20Technologies%20Jan%202017/Images/author-avatar.png" alt="{{ item.display_name }}">                {% endif %}            </span>        <span class="author-details">        {{ item }}        </span>    </a> </div> {% endfor %}
Post a Comment
Read more

RSS Listing converted into Vertical Thumb Slider

Image
HUBL CODE ================================================ <link rel="stylesheet" type="text/css" href="//cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick.css"/> <script type="text/javascript" src="//cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick.min.js"></script> <div class="vertical_slider_group slider slider-for">   {% if module.rss_feed_type == "external" %}   {% set feed_source = "{is_external=True, rss_url='"~module.rss_url~"', content_group_id=''}" %}   {% set is_external = true %}   {% elif module.rss_feed_type == "blog" %}   {% set feed_source = "{is_external=False, content_group_id='" ~ module.content_group_id ~ "', rss_url=''}" %}   {% set is_external = false %}   {% endif %}     {% rss_listing     publish_date_text="{{ module.publish_date_text }}",     rs
Post a Comment
Read more

worm type border effect in menu

Image
JS ============================ $('.custom-menu-primary .custom-left-menu .hs-menu-wrapper').append('<div id="line"></div>'); $('.custom-menu-primary .custom-left-menu .hs-menu-wrapper > ul').prepend('<li style="display:none;" class="hs-menu-item hs-menu-depth-1 active-click"></li>'); (function () {   var $activeWidth, $defaultMarginLeft, $defaultPaddingLeft, $firstChild, $line, $navListItem;   $line = $('#line');   $navListItem = $('.custom-menu-primary .custom-left-menu .hs-menu-wrapper > ul > li > a');   $activeWidth = $('.active-click').width();   $firstChild = $('.custom-menu-primary .custom-left-menu .hs-menu-wrapper > ul > li:first-child');   $defaultMarginLeft = parseInt($('.custom-menu-primary .custom-left-menu .hs-menu-wrapper > ul > li').next().position().left);   $defaultPaddingLeft = parseInt($('.custom-m
Post a Comment
Read more

social share

https://preview.hs-sites.com/_hcms/preview/template/multi?blog_listing=false&content_group_id=null&is_buffered_template_layout=true&portalId=4280632&tc_deviceCategory=undefined&template_layout_id=6313792316&updated=1539350012713 <ul class="cherry-share_list clearfix">                 <li class="cherry-share_item facebook-item">                     <a class="share_facebook cherry-share_link" href="https://www.facebook.com/sharer/sharer.php?u={{content.absolute_url}}&t={{ content.name|striptags }}" target="_blank"><i class="flaticon-facebook"></i><span class="cherry-share_label">Facebook</span></a>                 </li>                 <li class="cherry-share_item twitter-item">                     <a class="share_twitter cherry-share_link" href="javascript:void(0)" title="Share on T
Post a Comment
Read more

Revolution Slider with Before After

<link rel= 'stylesheet' id= 'rs-beforeafter-front-css' href= 'https://revolution.themepunch.com/wp-content/plugins/revslider-beforeafter-addon/public/assets/css/revolution.addon.beforeafter.css?ver=1.0.1' type= 'text/css' media= 'all' /> <link rel= 'stylesheet' id= 'rs-plugin-settings-css' href= 'https://revolution.themepunch.com/wp-content/plugins/revslider/public/assets/css/settings.css?ver=5.4.8' type= 'text/css' media= 'all' /> <script type= 'text/javascript' src= 'https://revolution.themepunch.com/wp-content/plugins/revslider/public/assets/js/jquery.themepunch.revolution.min.js?ver=5.4.8' > < /script> <script type= "text/javascript" > function setREVStartSize ( e ){                                                           try { e . c = jQuery ( e . c ); var i = jQuery (window) .width (), t = 9999 , r = 0 , n = 0 ,
Post a Comment
Read more