"blog"
Bootstrap 3.0.0 Snippet by sumi9xm

<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script> <script src="//code.jquery.com/jquery-1.11.1.min.js"></script> <!------ Include the above in your HEAD tag ----------> <div id="page" class="hfeed site site-container"> <div class="site-pusher"> <section class="lifesection"> <div class="gridcontainer"> <div class="life-search"> <form role="search" method="get" class="searchform group" action=""> <input type="search" class="search-input" placeholder="Search Your Life Style" value="" name="s" onkeyup="buttonUp();" title="Search for:"> <input type="submit" id="srch-btn-go" class="btn btn-peach searchbox-submit" value="GO" name="sa"> <div class="searchbtn"><i class="fa fa-search" aria-hidden="true"></i></div> </form> </div> <ul id="lifegrid" style="position: relative; height: 1911px;"> <li class="col-md-4 col-xs-12 life-content oddpost show" style="position: absolute; width: 310px; left: 75px; top: 0px;"> <div class="lifeimgcont"> <a href="#"><img width="510" height="382" src="https://lh3.googleusercontent.com/-HxSAl6WJSI0/WM-dbkQ1ONI/AAAAAAAADuE/-j9GwJvDOZcwTGuthBQay7XsdsPmtaC6gCL0B/w424-d-h319-p-rw/sumit.png" class="attachment-post-thumbnail size-post-thumbnail wp-post-image" alt="" sizes="(max-width: 510px) 100vw, 510px"> </a> <div class="eventdate"> <strong>15</strong> May </div> </div> <h4 class="evntheader"><a href="#">Sumit Kumar!</a></h4> <article id="post-316" class="post-316 post type-post status-publish format-standard has-post-thumbnail hentry category-health category-inspiration tag-fitness tag-health tag-workout tag-workout-tip"> <div class="entry-content"> <p>Tabata training is one of my favourite forms of exercise, especially when crunched for...</p> </div> <!-- .entry-content --> </article> <!-- #post-## --> <div class="eventsocialinks"> <a href="#" target="_blank" class="fb-share"><i class="fa fa-facebook" aria-hidden="true"></i></a> <a href="#" target="_blank" class="fb-share"><i class="fa fa-twitter" aria-hidden="true"></i></a> </div> </li> <li class="col-md-4 col-xs-12 life-content evenpost show" style="position: absolute; width: 310px; left: 385px; top: 0px;"> <div class="lifeimgcont"> <a href="#"><img width="3877" height="3102" src="http://www.boldrfit.com/life/wp-content/uploads/2017/04/michelle-pic.jpg" class="attachment-post-thumbnail size-post-thumbnail wp-post-image" alt="" sizes="(max-width: 3877px) 100vw, 3877px"> </a> <div class="eventdate"> <strong>27</strong> Apr </div> </div> <h4 class="evntheader"><a href="#">4 Reasons You’re Not As Healthy As You Think You Are!</a></h4> <article id="post-298" class="post-298 post type-post status-publish format-standard has-post-thumbnail hentry category-health category-holistic category-natural category-nutrition category-wellness category-womens-health tag-balance tag-habit tag-health tag-holistic tag-inspiration tag-life tag-wellness tag-womens-health"> <div class="entry-content"> <p>This week we feature our first guest blogger expert, Michelle Kapler, R.Ac.! She is...</p> </div> <!-- .entry-content --> </article> <!-- #post-## --> <div class="eventsocialinks"> <a href="#" target="_blank" class="fb-share"><i class="fa fa-facebook" aria-hidden="true"></i></a> <a href="#" target="_blank" class="fb-share"><i class="fa fa-twitter" aria-hidden="true"></i></a> </div> </li> <li class="col-md-4 col-xs-12 life-content oddpost show" style="position: absolute; width: 310px; left: 695px; top: 0px;"> <div class="lifeimgcont"> <a href=""><img width="2908" height="3352" src="http://www.boldrfit.com/life/wp-content/uploads/2017/04/FullSizeRender.jpg" class="attachment-post-thumbnail size-post-thumbnail wp-post-image" alt="" sizes="(max-width: 2908px) 100vw, 2908px"> </a> <div class="eventdate"> <strong>09</strong> Apr </div> </div> <h4 class="evntheader"><a href="#">Buttery-Cinnamon-Pear Overnight Oat Breakfast Bowl Delight</a></h4> <article id="post-259" class="post-259 post type-post status-publish format-standard has-post-thumbnail hentry category-nutrition category-recipe"> <div class="entry-content"> <p>Did that title get your attention? It’s a mouthful but stay with me because...</p> </div> <!-- .entry-content --> </article> <!-- #post-## --> <div class="eventsocialinks"> <a href="" target="_blank" class="fb-share"><i class="fa fa-facebook" aria-hidden="true"></i></a> <a href="" target="_blank" class="fb-share"><i class="fa fa-twitter" aria-hidden="true"></i></a> </div> </li> <li class="col-md-4 col-xs-12 life-content evenpost show" style="position: absolute; width: 310px; left: 75px; top: 444px;"> <div class="lifeimgcont"> <a href=""><img width="3212" height="2408" src="http://www.boldrfit.com/life/wp-content/uploads/2017/03/breathing-its-kind-of-a-big-deal.jpg" class="attachment-post-thumbnail size-post-thumbnail wp-post-image" alt="" srcset="" sizes="(max-width: 3212px) 100vw, 3212px"> </a> <div class="eventdate"> <strong>29</strong> Mar </div> </div> <h4 class="evntheader"><a href="">So Simple. So Clean.</a></h4> <article id="post-253" class="post-253 post type-post status-publish format-standard has-post-thumbnail hentry category-fitness category-health category-nutrition category-recipe"> <div class="entry-content"> <p>Simple.  Clean.  15 minutes. This works for lunch or dinner and it’s satisfyingly clean...</p> </div> <!-- .entry-content --> </article> <!-- #post-## --> <div class="eventsocialinks"> <a href="" target="_blank" class="fb-share"><i class="fa fa-facebook" aria-hidden="true"></i></a> <a href="" target="_blank" class="fb-share"><i class="fa fa-twitter" aria-hidden="true"></i></a> </div> </li> <li class="col-md-4 col-xs-12 life-content oddpost show" style="position: absolute; width: 310px; left: 385px; top: 477px;"> <div class="lifeimgcont"> <a href=""><img width="2540" height="2404" src="http://www.boldrfit.com/life/wp-content/uploads/2017/03/Mango-Ginger.jpg" class="attachment-post-thumbnail size-post-thumbnail wp-post-image" alt="" sizes="(max-width: 2540px) 100vw, 2540px"> </a> <div class="eventdate"> <strong>13</strong> Mar </div> </div> <h4 class="evntheader"><a href="">Mango Madness!</a></h4> <article id="post-243" class="post-243 post type-post status-publish format-standard has-post-thumbnail hentry category-nutrition category-recipe"> <div class="entry-content"> <p>Mango Madness Chia Pudding + Smoothie + Popsicles With this mango madness you are...</p> </div> <!-- .entry-content --> </article> <!-- #post-## --> <div class="eventsocialinks"> <a href="" target="_blank" class="fb-share"><i class="fa fa-facebook" aria-hidden="true"></i></a> <a href="" target="_blank" class="fb-share"><i class="fa fa-twitter" aria-hidden="true"></i></a> </div> </li> <li class="col-md-4 col-xs-12 life-content evenpost show" style="position: absolute; width: 310px; left: 695px; top: 594px;"> <div class="lifeimgcont"> <a href=""><img width="3024" height="4032" src="http://www.boldrfit.com/life/wp-content/uploads/2017/03/quinoa.jpg" class="attachment-post-thumbnail size-post-thumbnail wp-post-image" alt="" sizes="(max-width: 3024px) 100vw, 3024px"> </a> <div class="eventdate"> <strong>11</strong> Mar </div> </div> <h4 class="evntheader"><a href="">Protein Pancakes</a></h4> <article id="post-229" class="post-229 post type-post status-publish format-standard has-post-thumbnail hentry category-health category-nutrition category-recipe category-uncategorized tag-clean-eating tag-healthy-eating tag-healthy-recipes tag-pancakes"> <div class="entry-content"> <p>Who doesn’t love a good pancake? Growing up, my mom made us buttermilk pancakes...</p> </div> <!-- .entry-content --> </article> <!-- #post-## --> <div class="eventsocialinks"> <a href="" target="_blank" class="fb-share"><i class="fa fa-facebook" aria-hidden="true"></i></a> <a href="" target="_blank" class="fb-share"><i class="fa fa-twitter" aria-hidden="true"></i></a> </div> </li> <li class="col-md-4 col-xs-12 life-content oddpost show" style="position: absolute; width: 310px; left: 75px; top: 888px;"> <div class="lifeimgcont"> <a href=""><img width="100%" height="auto" src="http://www.boldrfit.com/life/wp-content/uploads/2017/03/quinoa.jpg" class="attachment-post-thumbnail size-post-thumbnail wp-post-image" alt="" sizes="(max-width: 1080px) 100vw, 1080px"> </a> <div class="eventdate"> <strong>08</strong> Mar </div> </div> <h4 class="evntheader"><a href="">Sorry not sorry!</a></h4> <article id="post-220" class="post-220 post type-post status-publish format-standard has-post-thumbnail hentry category-beauty category-health category-inspiration category-uncategorized"> <div class="entry-content"> <p>Sorry guys, we love you too. We really do.  Today however is a day...</p> </div> <!-- .entry-content --> </article> <!-- #post-## --> <div class="eventsocialinks"> <a href="" target="_blank" class="fb-share"><i class="fa fa-facebook" aria-hidden="true"></i></a> <a href="" target="_blank" class="fb-share"><i class="fa fa-twitter" aria-hidden="true"></i></a> </div> </li> <li class="col-md-4 col-xs-12 life-content evenpost show" style="position: absolute; width: 310px; left: 385px; top: 976px;"> <div class="lifeimgcont"> <a href=""><img width="927" height="720" src="http://www.boldrfit.com/life/wp-content/uploads/2017/03/IMG_8642.jpg" class="attachment-post-thumbnail size-post-thumbnail wp-post-image" alt="" sizes="(max-width: 927px) 100vw, 927px"> </a> <div class="eventdate"> <strong>04</strong> Mar </div> </div> <h4 class="evntheader"><a href="">Breathing – it’s kind of a big deal!</a></h4> <article id="post-213" class="post-213 post type-post status-publish format-standard has-post-thumbnail hentry category-health category-inspiration category-work-life"> <div class="entry-content"> <p>I have a toddler, a husband, a start up company and sell real estate...</p> </div> <!-- .entry-content --> </article> <!-- #post-## --> <div class="eventsocialinks"> <a href="" target="_blank" class="fb-share"><i class="fa fa-facebook" aria-hidden="true"></i></a> <a href="" target="_blank" class="fb-share"><i class="fa fa-twitter" aria-hidden="true"></i></a> </div> </li> <li class="col-md-4 col-xs-12 life-content oddpost show" style="position: absolute; width: 310px; left: 695px; top: 1201px;"> <div class="lifeimgcont"> <a href=""><img width="1080" height="1080" src="http://www.boldrfit.com/life/wp-content/uploads/2017/03/she-believed-she-could-so-she-did.png" class="attachment-post-thumbnail size-post-thumbnail wp-post-image" alt="" sizes="(max-width: 1080px) 100vw, 1080px"> </a> <div class="eventdate"> <strong>28</strong> Feb </div> </div> <h4 class="evntheader"><a href="">Carrying a few extra pounds?</a></h4> <article id="post-210" class="post-210 post type-post status-publish format-standard has-post-thumbnail hentry category-fitness category-health category-inspiration"> <div class="entry-content"> <p>If you’re carrying a little extra weight and feeling overwhelmed and self conscious, I...</p> </div> <!-- .entry-content --> </article> <!-- #post-## --> <div class="eventsocialinks"> <a href="" target="_blank" class="fb-share"><i class="fa fa-facebook" aria-hidden="true"></i></a> <a href="" target="_blank" class="fb-share"><i class="fa fa-twitter" aria-hidden="true"></i></a> </div> </li> <li class="col-md-4 col-xs-12 life-content evenpost show" style="position: absolute; width: 310px; left: 75px; top: 1378px;"> <div class="lifeimgcont"> <a href=""><img width="3024" height="3024" src="http://www.boldrfit.com/life/wp-content/uploads/2017/03/breathing-its-kind-of-a-big-deal.jpg" class="attachment-post-thumbnail size-post-thumbnail wp-post-image" alt="" sizes="(max-width: 3024px) 100vw, 3024px"> </a> <div class="eventdate"> <strong>26</strong> Feb </div> </div> <h4 class="evntheader"><a href="">(Healthy) Salted Chocolate Chip Cookies</a></h4> <article id="post-198" class="post-198 post type-post status-publish format-standard has-post-thumbnail hentry category-nutrition category-recipe tag-healthy-baking tag-healthy-recipes tag-oats tag-treats"> <div class="entry-content"> <p>Mmmmmmm what’s better than chocolate chip cookies? Well how about a chocolate chip cookie...</p> </div> <!-- .entry-content --> </article> <!-- #post-## --> <div class="eventsocialinks"> <a href="" target="_blank" class="fb-share"><i class="fa fa-facebook" aria-hidden="true"></i></a> <a href="" target="_blank" class="fb-share"><i class="fa fa-twitter" aria-hidden="true"></i></a> </div> </li> </ul> <div class="clearfix"></div> <div class="paging"> <a href="" class="paging-button com-btn">></a> </div> </div> <!-- #primary --> </section> </div> </div>
article, aside, details, figcaption, figure, footer, header, main, menu, nav, section, summary { display: block; } [hidden], template { display: none; } /*-------------------------------------------------------------- # Elements --------------------------------------------------------------*/ html { box-sizing: border-box; } *, *:before, *:after { box-sizing: inherit; } li > ul, li > ol { margin-bottom: 0; margin-left: 1.5em; } img { height: auto; /* Make sure images are scaled correctly. */ max-width: 100%; /* Adhere to container width. */ } input[type="text"], input[type="email"], input[type="url"], input[type="password"], input[type="search"], textarea { color: #666; border: 1px solid #ccc;/*border-radius: 3px;*/ } input[type="text"]:focus, input[type="email"]:focus, input[type="url"]:focus, input[type="password"]:focus, input[type="search"]:focus, textarea:focus { color: #111; } input[type="text"], input[type="email"], input[type="url"], input[type="password"], input[type="search"] { /*padding: 3px;*/ } textarea { padding-left: 3px; width: 100%; } /*-------------------------------------------------------------- ## Menus --------------------------------------------------------------*/ /* Small menu. */ .menu-toggle, .main-navigation.toggled ul { display: block; } #lifegrid li > div { margin: 0 0 30px!important; } .life-content { text-align:center; } .entry-content p { font-size: 16px; line-height: 24px; } .form input, .form select, .form textarea { font-family: 'Work Sans', sans-serif; width: 100%; color: #444748; border:none; border-bottom:1px solid #bbbbbb; padding:10px 0 15px; margin: 0; margin-bottom:3px; outline:none; } .form textarea { border:1px solid #bbbbbb; resize:none; min-height:350px; } .comment-form { margin: auto; max-width: 600px; } .form-submit input[type="submit"] { padding:0 25px; border:3px solid #000; font-size:20px; height: 70px; min-width: 250px; display: inline-block; margin: 0 auto; text-transform: uppercase; background-color: transparent; color: #000; font-weight: 500; transition: background 0.5s ease, color 0.5s ease; } .form-submit input[type="submit"]:hover { background:#000; color:#fff; } .entry-meta { padding:10px 0px; } .comment-reply-title { padding:10px 0px; } /*============================ life Article Section Css Here===================== ========================================================================= */ .life-article-section { margin:100px 0 0; padding:0px; float:left; width:100%; } .article-block { float: left; margin-bottom: 50px; width: 100%; } .article-img img { width:100%; } .widget_recent_entries, .post-block { float: left; margin: 0; padding: 0; width: 100%; } .recent-posts-widget-with-thumbnails .widget-title, .widget_categories .widget-title, .widget_recent_entries .widget-title, .post-block h3 { font-size: 20px; font-weight: 400; margin: 50px 0 20px; } .post-list { float: left; margin: 0 0 20px; padding: 0; width: 100%; } .post-image { float: left; margin-right:6%; width: 38%; } .post-image img { width:100%; } .post-detail { float: left; width: 56%; } .widget a, .post-detail label { color: #46defa; font-size: 14px; font-weight: 500; margin-bottom:0px; } .widget .rpwwt-post-date, .post-detail span { font-size:13px; font-weight: 400; margin-top: 15px; } .article-detail { float: left; margin: 40px 0; width: 100%; } .article-detail span { float:left; font-size: 13px; font-weight: 100; margin:0 5px 0 0; width: auto; } .meta-title { float:left; width:100%; margin:10px 0 50px; } .post-categories { float:left; } .post-categories li { float: left; font-weight: 500; padding: 0 2px; } .post-categories li a:hover { color:#46defa; } .no-mar { margin:0px!important; } .article-detail p { float:left; width:100%; margin:0 0 30px; font-size:16px; } .article-detail p strong { float:left; width:100%; font-size:16px; } .article-detail blockquote p, .small-para { color: #46defa; float: left; font-size:40px; font-weight: 100; line-height:48px; margin: 50px 0; width: 100%; } .article-detail blockquote { padding: 0; margin: 0; font-size: 0; border-left: 0; } .article-detail blockquote p:last-child { margin-bottom:50px; } .footer { float: left; padding-top: 150px; width: 100%; } .widget_categories, .post-category { float: left; margin:50px 0 0; width: 100%; } .post-category h3 { font-size: 20px; font-weight: 400; margin: 50px 0 20px; } .widget_categories ul, .post-category ul { margin:0px; padding:0px; } .widget_categories ul li, .post-category ul li { margin:0px; list-style:none; float:left; width:100%; } .widget_categories ul li a, .post-category ul li a { border-bottom: 1px solid #e6e8e8; color: #999; display: block; font-size: 14px; font-weight: 300; margin: 0; padding: 11px 0; } .widget_categories ul li a:hover, .post-category ul li a:hover { color:#46defa; } /***********End life Css *********************/ /*-------------------------------------------------------------- ## Posts and pages --------------------------------------------------------------*/ .hentry { margin: 0 0 1.5em; } .byline, .updated:not(.published) { display: none; } .single .byline, .group-blog .byline { display: inline; } .page-content, .entry-content, .entry-summary { margin: 1em 0 0; } .page-links { clear: both; margin: 0 0 1.5em; } /*-------------------------------------------------------------- # Media --------------------------------------------------------------*/ .page-content .wp-smiley, .entry-content .wp-smiley, .comment-content .wp-smiley { border: none; margin-bottom: 0; margin-top: 0; padding: 0; } /* Make sure embeds and iframes fit their containers. */ embed, iframe, object { max-width: 100%; } /********************All Media Query Start Here*********************************/ @media(max-width:1440px) { .article-detail blockquote p, .small-para { font-size: 36px; font-weight: 100; line-height: 44px; } } .article-detail blockquote p, .small-para { font-size:36px; line-height:40px; } .article-detail p { font-size:16px; } .recent-posts-widget-with-thumbnails .widget-title, .widget_categories .widget-title, .widget_recent_entries .widget-title, .post-block h3 { font-size:16px; } .article-detail p strong { font-size: 16px; } .article-block { margin-bottom:0px; } .article-detail { margin-bottom:0px; } .post-categories li a { font-size:11px; } .article-detail p { font-size:15px; } .article-detail p strong { font-size:16px; } @media(max-width:640px) { .article-detail blockquote p, .small-para { font-size: 24px; font-weight: 100; line-height: 30px; } .article-detail p { font-size:13px; } .article-detail p strong { font-size:13px; } .life-article-section { margin-top:30px; } .article-block { margin-bottom:0px; } .article-detail { margin-bottom:0px; } .article-detail blockquote p, .small-para { font-size:24px; line-height:30px; } } /*============================ Life Page ================================== ========================================================================= */ .gridcontainer { max-width: 1100px; display: block; margin: 0 auto; } .lifesection { width: 100%; float: left; border-top: 1px solid #d0d7d9; border-bottom: 1px solid #d0d7d9; background-color: #fff; } .life-search { width: 100%; position: relative; height: 50px; margin: 20px 0; } .life-search .searchbtn { cursor: pointer; height: 30px; width: 30px; float: right; padding: 9px; margin: 1px; background: #1c9cda; z-index: 1; box-sizing: content-box; position: relative; } .life-search .searchbtn i{ font-size: 20px; padding: 5px; color: #fff; } .life-search .search-input { position: absolute; right: 0; top: 0; width: 0; transition: width 1s ease, border 0.1s ease; height: 100%; border:none; text-align: center; z-index: 1; } .life-search .search-input.stretch { width: 100%; border: 1px solid #1c9cda; } .paging { text-align: center; display: block; margin: 35px 0; } .paging-button { width: 300px; height: 50px; margin: 0 8px; font-weight: 500; display: inline-block; line-height: 45px; font-size: 18px; background-color: black; color: #fff; } #srch-btn-go { /* float: right; */ position: absolute; box-sizing: content-box; right: -1px; top: -1px; background: transparent url(../images/search-icon.png) no-repeat center center; text-indent: -99999px; width: 30px; height: 30px; padding: 9px; margin: 1px; } .blue { color: #46defa } /*============================ Responsive ================================ ========================================================================= */ @media screen and (max-width: 1200px) { .gridcontainer { max-width:900px; } .entry-content p { font-size: 15px; line-height: 21px; } .evntheader { margin:0px; } } @media screen and (min-width: 1024px) { .section { min-height: 100vh; } } @media only screen and (max-width: 768px) { .life-search { height: 50px; margin: 20px auto; position: relative; width: 96%; } .evntheader { font-size:16px; } } #lifegrid { margin: 10px; } #lifegrid li { left: 0; top: 0; opacity: 0; transform: translateY(100px); } #lifegrid li.show { opacity: 1; transform: translateY(0); transition: all 0.3s, top 1s; } #lifegrid li > div { color: rgba(0,0,0,0.6); font-size: 20px; border-radius: 3px; margin: 18px; background: rgb(255,255,255); border: 1px solid rgba(038, 191, 64, 0); transition: all 0.5s; text-align: center; } #lifegrid > li:hover { transform: translateY(-10px); /* border: 1px solid rgba(038, 191, 64, 1);*/ box-shadow: 0 10px 15px rgba(125, 125, 125, 0.1); box-shadow: 0 2px 5px 0 rgba(0,0,0,0.16), 0 2px 10px 0 rgba(0,0,0,0.12); transition: all 0.3s; } .lifeimgcont{ position: relative; } .lifeimgcont img{width: 100%;} .lifeimgcont .eventdate { background: rgba(255,255,255,0.7); box-sizing: border-box; font-weight: 300; left: 15px; line-height: 1; padding:8px; position: absolute; top: 15px; width: 60px; font-size: 14px; } .lifeimgcont .eventdate strong{ font-weight: 500; font-size:24px;} .eventsocialinks{ display: inline-block; margin: 30px 0;} .eventsocialinks a .fa{ width: 35px; height: 35px; border-radius: 50%; background:#c6c6c6; transition: background 0.5s ease; color: #fff; font-size:16px; line-height: 35px; } .eventsocialinks a:hover .fa{ background:#000; } .evntheader{ color: #46defa; font-weight: 500; margin:15px 0; text-align: center; } img.wp-smiley, img.emoji { display: inline !important; border: none !important; box-shadow: none !important; height: 1em !important; width: 1em !important; margin: 0 .07em !important; vertical-align: -0.1em !important; background: none !important; padding: 0 !important; }
jQuery(document).ready(function($){ //Responsive navigation animation jQuery("#burgernav").click(function(){ jQuery(this).toggleClass("is-active"); jQuery('body').toggleClass('with--sidebar'); }); jQuery('#site-cache').click(function(e){ jQuery("#burgernav").toggleClass("is-active"); jQuery('body').removeClass('with--sidebar'); }); //create the slider jQuery('.cd-testimonials-wrapper').flexslider({ selector: ".cd-testimonials > li", animation: "slide", controlNav: true, slideshow: false, smoothHeight: true, start: function(){ jQuery('.cd-testimonials').children('li').css({ 'opacity': 1, 'position': 'relative' }); } }); //Video Controls //Handle to controls var playicon = jQuery(".playpause"); var video = jQuery(".video"); var volume = jQuery(".volume"); //when video is played video.on('play', function () { // do something playicon.hide(); }); //when video is paused or ends video.on('pause ended', function () { playicon.show(); }); //when video is clicked at any point on the screen like youtube video video.click(function(){ //Check if video is in the paused state if(video[0].paused == true){ video[0].play(); } //if video is in the play state else{ video[0].pause(); } }); //On volume click volume.click(function(){ jQuery(this).toggleClass("muted"); var bool = video.prop("muted"); video.prop("muted",!bool); }); }); jQuery(window).load(function(){ jQuery(".load-overlay").fadeOut('slow', function(){ jQuery(this).remove(); }); var searchinputhandle = jQuery(".search-input"); var searchbutton = jQuery(".searchbtn"); jQuery('#lifegrid').NewWaterfall({ width: 310, delay: 60, repeatShow: false }); searchbutton.click(function(e){ e.stopPropagation(); searchinputhandle.toggleClass("stretch"); }); jQuery('.paging a').addClass('paging-button com-btn'); var inputVal = jQuery('.search-input').val(); inputVal = jQuery.trim(inputVal).length; if( inputVal !== 0){ jQuery('.life-search input.searchbox-submit').css('z-index','800'); //$('.searchbox-icon').css('display','none'); } else { jQuery('.search-input').val(''); jQuery('.life-search input.searchbox-submit').css('z-index',''); //$('.searchbox-icon').css('display','block'); } }); function buttonUp() { var inputVal = jQuery('.life-search .search-input').val(); //alert(inputVal); inputVal = jQuery.trim(inputVal).length; if( inputVal !== 0) { jQuery('.life-search input.searchbox-submit').css('z-index','800'); jQuery('.searchbtn').css('display','none'); } else { jQuery('.life-search .search-input').val(''); jQuery('.life-search input.searchbox-submit').css('z-index',''); jQuery('.searchbtn').css('display','block'); } } jQuery(document).ready(function() { jQuery(".top-btn").click(function() { jQuery(".maintopnav").slideToggle(); }); jQuery(".menuIcon").click(function() { jQuery(".menuIcon").toggleClass("active"); }); jQuery(document.body).click( function() { jQuery(".searchbtn").removeClass("stretch"); jQuery(".profile-menu").removeClass("profile-slide"); //alert("hello"); }); jQuery(".mobile-profile .user-profile").click(function(e) { e.stopPropagation(); jQuery(".profile-menu").toggleClass("profile-slide"); }); jQuery(document).ready(function() { jQuery('.fb-share').click(function(e) { e.preventDefault(); window.open(jQuery(this).attr('href'), 'fbShareWindow', 'height=450, width=550, top=' + (jQuery(window).height() / 2 - 275) + ', left=' + (jQuery(window).width() / 2 - 225) + ', toolbar=0, location=0, menubar=0, directories=0, scrollbars=0'); return false; }); }); }); jQuery(document).ready(function() { jQuery(".topnav").accordion({ accordion:false, speed: 500, closedSign: '+', openedSign: '-' }); }); jQuery(window).bind("pageshow", function() { jQuery('.life-search input.searchbox-submit').css('z-index',''); }); (function($) { $.fn.NewWaterfall = function(options) { var defaults = { width: 360, delay: 60, repeatShow: false }; var config = $.extend({},defaults, options); var ul = this; var show = function(li) { if ($(window).scrollTop() + $(window).height() > $(li).offset().top) { $(li).addClass('show'); } else if ($(window).scrollTop() + $(window).height() < $(li).offset().top) { if (config.repeatShow) { $(li).removeClass('show'); } } } var refresh = function() { if(ul.length <= 0) { return; } ul.css({ "position": "relative" }); var lis = $(ul).children("li"); if(lis.length <= 0) { return; } var ul_width = $(ul).width(); var ul_column = parseInt(ul_width / config.width); if (lis.length < ul_column) { ul_column = lis.length; } var li_left = (ul_width - ul_column * config.width) / 2; if (ul_column > 0) { lis.css({ "position": "absolute", "width": config.width }); var maxHeight = 0; var list = [] var nlist = [] for (var i = 0; i < lis.length; i++) { list.push({ "index": i, "bottom": 0, "height": $(lis[i]).height(), }); } for (var i = 0; i < ul_column; i++) { nlist.push([]); } for (var i = 0; i < lis.length; i++) { if (i < ul_column) { list[i]["bottom"] = list[i]["height"]; nlist[i].push(list[i]); } else { var b = 0; var l = 0; for (var j = 0; j < ul_column; j++) { var jh = nlist[j][nlist[j].length - 1]["bottom"] + list[i]["height"]; if (b == 0 || jh < b) { b = jh; l = j; } } list[i]["bottom"] = b; nlist[l].push(list[i]); } } for (var i = 0; i < nlist.length; i++) { for (var j = 0; j < nlist[i].length; j++) { $(lis[nlist[i][j]["index"]]).css({ "left": i * config.width + li_left, "top": nlist[i][j]["bottom"] - nlist[i][j]["height"] }); } } for (var i = 0; i < nlist.length; i++) { var h = nlist[i][nlist[i].length -1]["bottom"]; if (maxHeight < h) { maxHeight = h; } } $(ul).css("height",maxHeight); } else { lis.attr("style",""); ul.attr("style",""); } for (var i = 0; i < lis.length; i++) { show(lis[i]); } } refresh(); setInterval(refresh,config.delay); } })(jQuery);

Related: See More


Questions / Comments: