VIDEO
HTML is the language used to create web pages. It stands for HyperText Markup Language. HTML is a markup language, which is a type of computer language. HTML uses tags to identify different parts of a web page.
Tags are words surrounded by angle brackets, like this: .
Tags come in pairs, a start tag and an end tag. The start tag is the beginning of the element, and the end tag is the end of the element.
The following is an example of a simple HTML document:
My First HTML Document
Hello, world!
The declaration is a special tag that tells the web browser that the document is written in HTML.
The tag is the root element of the document. It contains all of the other elements.
The
tag contains information about the document, like the title.
The
tag contains the content of the document.
HTML tags are not case sensitive. The
tag is the same as the
tag.
HTML tags are usually written in lowercase.
There are many different HTML tags. Here are some of the most common ones:
</p>
<p><body></p>
<h1>
<p><a></p>
<p>HTML is a very simple language, but it can be used to create complex web pages.</p>
<p>In the next lesson, we will learn about the different parts of an HTML document.</p>
</div>
<div class="tags-bg p-2 mt-3 mb-3">
Tags: <a href="https://www.recue.com/tag/basics/" rel="tag">basics</a>, <a href="https://www.recue.com/tag/beginner/" rel="tag">beginner</a>, <a href="https://www.recue.com/tag/css-tutorial/" rel="tag">css tutorial</a>, <a href="https://www.recue.com/tag/css-tutorial-for-beginners/" rel="tag">css tutorial for beginners</a>, <a href="https://www.recue.com/tag/how/" rel="tag">how</a>, <a href="https://www.recue.com/tag/html/" rel="tag">html</a>, <a href="https://www.recue.com/tag/html-and-css-tutorial-for-beginners/" rel="tag">html and css tutorial for beginners</a>, <a href="https://www.recue.com/tag/html-for-beginners/" rel="tag">html for beginners</a>, <a href="https://www.recue.com/tag/html-tutorial-for-beginners/" rel="tag">html tutorial for beginners</a>, <a href="https://www.recue.com/tag/html5/" rel="tag">html5</a>, <a href="https://www.recue.com/tag/html5-tutorial/" rel="tag">html5 tutorial</a>, <a href="https://www.recue.com/tag/introduction-to-html/" rel="tag">introduction to html</a>, <a href="https://www.recue.com/tag/learn/" rel="tag">learn</a>, <a href="https://www.recue.com/tag/make/" rel="tag">make</a>, <a href="https://www.recue.com/tag/tags/" rel="tag">tags</a>, <a href="https://www.recue.com/tag/to/" rel="tag">to</a>, <a href="https://www.recue.com/tag/tutorial/" rel="tag">tutorial</a>, <a href="https://www.recue.com/tag/webpage/" rel="tag">webpage</a>, <a href="https://www.recue.com/tag/website/" rel="tag">website</a>, <a href="https://www.recue.com/tag/xhtml/" rel="tag">XHTML</a> </div>
<nav class="navigation post-navigation" aria-label="Posts">
<h2 class="screen-reader-text">Post navigation</h2>
<div class="nav-links"><div class="nav-previous"><a href="https://www.recue.com/building-a-website-with-editor-x-part-2/" rel="prev"><span class="meta-nav" aria-hidden="true">Previous</span> <span class="screen-reader-text">Previous post:</span> <span class="post-title">Building a Website with Editor X – Part 2</span></a></div><div class="nav-next"><a href="https://www.recue.com/dropshipping-for-beginners-how-to-make-money-online-in-2022-passive-income-online-business/" rel="next"><span class="meta-nav" aria-hidden="true">Next</span> <span class="screen-reader-text">Next post:</span> <span class="post-title">Dropshipping for Beginners | How to Make Money Online in 2022 | Passive Income & Online Business</span></a></div></div>
</nav> <div class="related-post">
<h3 class="py-3">Related Post</h3>
<div class="row">
<div class="col-lg-4 col-md-6">
<article id="post-100633" class="inner-service post-100633 post type-post status-publish format-standard has-post-thumbnail hentry category-html-php-javascript">
<div class="post-main-box p-3 mb-3 text-center wow zoomIn" data-wow-duration="2s">
<div class="box-image">
<img width="1280" height="720" src="https://www.recue.com/wp-content/uploads/2023/08/1693355454_maxresdefault.jpg" class="attachment-post-thumbnail size-post-thumbnail wp-post-image" alt="" decoding="async" fetchpriority="high" srcset="https://www.recue.com/wp-content/uploads/2023/08/1693355454_maxresdefault.jpg 1280w, https://www.recue.com/wp-content/uploads/2023/08/1693355454_maxresdefault-300x169.jpg 300w, https://www.recue.com/wp-content/uploads/2023/08/1693355454_maxresdefault-1024x576.jpg 1024w, https://www.recue.com/wp-content/uploads/2023/08/1693355454_maxresdefault-768x432.jpg 768w" sizes="(max-width: 1280px) 100vw, 1280px" /> </div>
<h2 class="section-title mt-0 pt-0"><a href="https://www.recue.com/birthday-html-css-javascript/">Birthday | HTML CSS JavaScript<span class="screen-reader-text">Birthday | HTML CSS JavaScript</span></a></h2>
<div class="new-text">
<p>
shorts #html #css #javascript #tutorials #trending Source code: https://shorturl.at/nsAMR Sound effects from Pixabay. </p>
</div>
<div class="more-btn mt-4 mb-4">
<a class="p-3" href="https://www.recue.com/birthday-html-css-javascript/">Read More<span class="screen-reader-text">Read More</span></a>
</div>
</div>
<div class="clearfix"></div>
</article>
</div>
<div class="col-lg-4 col-md-6">
<article id="post-52991" class="inner-service post-52991 post type-post status-publish format-standard has-post-thumbnail hentry category-html-php-javascript tag-css3-tutorial-in-telugu tag-html-5-tutorial-in-telugu tag-html-in-telugu tag-html-tutorial-for-beginners tag-html-tutorial-for-beginners-in-telugu tag-html-tutorial-in-telugu tag-html-tutorial-in-telugu-pdf tag-html5-tutorial tag-telugu-computer-html tag-web-designing-tutorials-in-telugu">
<div class="post-main-box p-3 mb-3 text-center wow zoomIn" data-wow-duration="2s">
<div class="box-image">
<img width="640" height="360" src="https://www.recue.com/wp-content/uploads/2022/08/HTML-5-Tutorial-in-Telugu.png" class="attachment-post-thumbnail size-post-thumbnail wp-post-image" alt="HTML 5 Tutorial in Telugu" decoding="async" srcset="https://www.recue.com/wp-content/uploads/2022/08/HTML-5-Tutorial-in-Telugu.png 640w, https://www.recue.com/wp-content/uploads/2022/08/HTML-5-Tutorial-in-Telugu-300x169.png 300w" sizes="(max-width: 640px) 100vw, 640px" /> </div>
<h2 class="section-title mt-0 pt-0"><a href="https://www.recue.com/html-5-tutorial-in-telugu/">HTML 5 Tutorial in Telugu<span class="screen-reader-text">HTML 5 Tutorial in Telugu</span></a></h2>
<div class="new-text">
<p>
In this tutorial you will learn about “HTML 5 and CSS 3 Tutorial in Telugu”. ———————————————————————– Useful Tutorials: C Tutorials : C++ Tutorials : Java Tutorials : Python Tutorials : </p>
</div>
<div class="more-btn mt-4 mb-4">
<a class="p-3" href="https://www.recue.com/html-5-tutorial-in-telugu/">Read More<span class="screen-reader-text">Read More</span></a>
</div>
</div>
<div class="clearfix"></div>
</article>
</div>
<div class="col-lg-4 col-md-6">
<article id="post-143385" class="inner-service post-143385 post type-post status-publish format-standard has-post-thumbnail hentry category-html-php-javascript">
<div class="post-main-box p-3 mb-3 text-center wow zoomIn" data-wow-duration="2s">
<div class="box-image">
<img width="480" height="360" src="https://www.recue.com/wp-content/uploads/2024/06/1718238756_hqdefault.jpg" class="attachment-post-thumbnail size-post-thumbnail wp-post-image" alt="" decoding="async" loading="lazy" srcset="https://www.recue.com/wp-content/uploads/2024/06/1718238756_hqdefault.jpg 480w, https://www.recue.com/wp-content/uploads/2024/06/1718238756_hqdefault-300x225.jpg 300w" sizes="(max-width: 480px) 100vw, 480px" /> </div>
<h2 class="section-title mt-0 pt-0"><a href="https://www.recue.com/html5-and-css3-tutorial-in-hindi-creating-first-webpage-using-html-hindi/">HTML5 and CSS3 tutorial in Hindi – creating first webpage using html hindi<span class="screen-reader-text">HTML5 and CSS3 tutorial in Hindi – creating first webpage using html hindi</span></a></h2>
<div class="new-text">
<p>
HTML5 and CSS3 tutorial in Hindi – creating first webpage using html in hind. Html 5 for beginners- learn step by step with daily … </p>
</div>
<div class="more-btn mt-4 mb-4">
<a class="p-3" href="https://www.recue.com/html5-and-css3-tutorial-in-hindi-creating-first-webpage-using-html-hindi/">Read More<span class="screen-reader-text">Read More</span></a>
</div>
</div>
<div class="clearfix"></div>
</article>
</div> </div>
</div>
</article><div class='code-block code-block-1' style='margin: 8px 0; clear: both;'>
<div id="amzn-assoc-ad-90f901ba-fbc9-4246-9599-3d26a31c2f42"></div><script async src="//z-na.amazon-adsystem.com/widgets/onejs?MarketPlace=US&adInstanceId=90f901ba-fbc9-4246-9599-3d26a31c2f42"></script></div>
<div class="navigation">
<div class="clearfix"></div>
</div>
</div>
<div class="col-lg-4 col-md-4" id="sidebar"><aside id="search-2" class="widget mb-5 p-3 widget_search">
<form method="get" class="search-form" action="https://www.recue.com/">
<label>
<span class="screen-reader-text">Search for:</span>
<input type="search" class="search-field" placeholder="SEARCH" value="" name="s">
</label>
<input type="submit" class="search-submit" value="SEARCH">
</form></aside><aside id="block-3" class="widget mb-5 p-3 widget_block">
<div class="wp-block-group"><div class="wp-block-group__inner-container is-layout-flow wp-block-group-is-layout-flow">
<h2 class="wp-block-heading">Recent Posts</h2>
<ul class="wp-block-latest-posts__list wp-block-latest-posts"><li><a class="wp-block-latest-posts__post-title" href="https://www.recue.com/%e0%a6%9f%e0%a6%be%e0%a6%95%e0%a6%be-%e0%a6%87%e0%a6%a8%e0%a6%95%e0%a6%be%e0%a6%ae-%e0%a6%95%e0%a6%b0%e0%a6%be%e0%a6%b0-%e0%a6%b8%e0%a6%b9%e0%a6%9c-%e0%a6%89%e0%a6%aa%e0%a6%be%e0%a6%af%e0%a6%bc-2024-4/">টাকা ইনকাম করার সহজ উপায় 2024 | Online earning bangla | Online income 2024 | Income</a></li>
<li><a class="wp-block-latest-posts__post-title" href="https://www.recue.com/quick-easy-traffic-generation/">Quick & Easy Traffic Generation</a></li>
<li><a class="wp-block-latest-posts__post-title" href="https://www.recue.com/proven-marketing-strategies-to-win-more-customers-shorts/">Proven marketing strategies to win more customers #shorts</a></li>
<li><a class="wp-block-latest-posts__post-title" href="https://www.recue.com/%f0%9f%94%b4-binary-options-trading-the-best-way-to-make-money-online-binary-options-strategy/">🔴 BINARY OPTIONS TRADING | THE BEST WAY TO MAKE MONEY ONLINE | Binary Options Strategy</a></li>
<li><a class="wp-block-latest-posts__post-title" href="https://www.recue.com/beginner-wordpress-seo-tutorial-how-to-get-more-traffic-on-your-wordpress-blog/">Beginner WordPress SEO Tutorial – How To Get More Traffic On Your WordPress Blog</a></li>
</ul></div></div>
</aside><aside id="block-6" class="widget mb-5 p-3 widget_block">
<div class="wp-block-group"><div class="wp-block-group__inner-container is-layout-flow wp-block-group-is-layout-flow">
<h2 class="wp-block-heading">Categories</h2>
<ul class="wp-block-categories-list wp-block-categories"> <li class="cat-item cat-item-23"><a href="https://www.recue.com/category/traffic-generation/advertising/">ADVERTISING</a>
</li>
<li class="cat-item cat-item-13"><a href="https://www.recue.com/category/make-money-online/affiliate-marketing/">AFFILIATE MARKETING</a>
</li>
<li class="cat-item cat-item-35"><a href="https://www.recue.com/category/websites/automation/">AUTOMATION</a>
</li>
<li class="cat-item cat-item-28"><a href="https://www.recue.com/category/traffic-generation/banners/">BANNERS</a>
</li>
<li class="cat-item cat-item-15912"><a href="https://www.recue.com/category/bonus/">BONUS</a>
</li>
<li class="cat-item cat-item-30"><a href="https://www.recue.com/category/websites/building-websites/">BUILDING WEBSITES</a>
</li>
<li class="cat-item cat-item-22"><a href="https://www.recue.com/category/traffic-generation/content-traffic/">CONTENT TRAFFIC</a>
</li>
<li class="cat-item cat-item-11"><a href="https://www.recue.com/category/make-money-online/copywriting/">COPYWRITING</a>
</li>
<li class="cat-item cat-item-27"><a href="https://www.recue.com/category/traffic-generation/craigslist/">CRAIGSLIST</a>
</li>
<li class="cat-item cat-item-17"><a href="https://www.recue.com/category/marketing/email-marketing/">EMAIL MARKETING</a>
</li>
<li class="cat-item cat-item-14"><a href="https://www.recue.com/category/make-money-online/freelancing/">FREELANCING</a>
</li>
<li class="cat-item cat-item-32"><a href="https://www.recue.com/category/websites/html-php-javascript/">HTML PHP JAVASCRIPT</a>
</li>
<li class="cat-item cat-item-29"><a href="https://www.recue.com/category/traffic-generation/keywords/">KEYWORDS</a>
</li>
<li class="cat-item cat-item-15"><a href="https://www.recue.com/category/marketing/lead-generation/">LEAD GENERATION</a>
</li>
<li class="cat-item cat-item-6"><a href="https://www.recue.com/category/make-money-online/">MAKE MONEY ONLINE</a>
</li>
<li class="cat-item cat-item-7"><a href="https://www.recue.com/category/marketing/">MARKETING</a>
</li>
<li class="cat-item cat-item-20"><a href="https://www.recue.com/category/marketing/mobile-marketing/">MOBILE MARKETING</a>
</li>
<li class="cat-item cat-item-26"><a href="https://www.recue.com/category/traffic-generation/ppc/">PPC</a>
</li>
<li class="cat-item cat-item-21"><a href="https://www.recue.com/category/traffic-generation/seo/">SEO</a>
</li>
<li class="cat-item cat-item-24"><a href="https://www.recue.com/category/traffic-generation/social-traffic/">SOCIAL TRAFFIC</a>
</li>
<li class="cat-item cat-item-25"><a href="https://www.recue.com/category/traffic-generation/solo-ads/">SOLO ADS</a>
</li>
<li class="cat-item cat-item-9"><a href="https://www.recue.com/category/traffic-generation/">TRAFFIC GENERATION</a>
</li>
<li class="cat-item cat-item-1"><a href="https://www.recue.com/category/uncategorized/">Uncategorized</a>
</li>
<li class="cat-item cat-item-18"><a href="https://www.recue.com/category/marketing/video-marketing/">VIDEO MARKETING</a>
</li>
<li class="cat-item cat-item-10"><a href="https://www.recue.com/category/websites/">WEBSITES</a>
</li>
<li class="cat-item cat-item-31"><a href="https://www.recue.com/category/websites/wordpress/">WORDPRESS</a>
</li>
</ul></div></div>
</aside></div>
</div>
<div class="clearfix"></div>
</main>
</div>
<footer role="contentinfo">
<aside id="footer" class="copyright-wrapper" role="complementary" aria-label="Footer">
<div class="container">
<div class="row">
<div class="footer_hide col-xs-12 footer-block">
</div>
<div class="footer_hide col-xs-12 footer-block">
</div>
<div class="footer_hide col-xs-12 col-xs-12 footer-block">
</div>
<div class="footer_hide col-xs-12 footer-block">
</div>
</div>
</div>
</aside>
<div id="footer-2" class="pt-3 pb-3 text-center">
<div class="copyright container">
<!---
<p class="mb-0"><a href=https://www.vwthemes.com/themes/free-review-wordpress-theme/ target='_blank'>Affiliate Review WordPress Theme</a> By VWThemes</p>
--->
<a href="#" class="scrollup"><i class="fas fa-long-arrow-alt-up"></i><span class="screen-reader-text">Scroll Up</span></a>
</div>
<div class="clear"></div>
</div>
</footer>
<div class="mysticky-welcomebar-fixed mysticky-welcomebar-position-top mysticky-welcomebar-showx-desktop mysticky-welcomebar-showx-mobile mysticky-welcomebar-display-desktop mysticky-welcomebar-display-mobile mysticky-welcomebar-attention-default mysticky-welcomebar-entry-effect-slide-in" style="" data-after-triger="after_a_few_seconds" data-triger-sec="0" data-position="top" data-height="60" data-rediect="close_bar" data-aftersubmission="dont_show_welcomebar">
<div class="mysticky-welcomebar-fixed-wrap">
<div class="mysticky-welcomebar-content">
<p>IMPORTANT NEWS - Just added - Free QR Code Generator for your blog or website, advertisments, salesletters- Take a look at this incredible opportunity to give your business the BIG BOOST it needs to grow and prosper! <a href="https://www.recue.com/QR/" target="_blank"><font color="#0000FF"><b><u>TRY IT NOW</u></b></font></a></p>
</div>
<div class="mysticky-welcomebar-btn">
<a href="javascript:void(0)" >Got it!</a>
</div>
<a href="javascript:void(0)" class="mysticky-welcomebar-close">X</a>
</div>
</div>
<script>
jQuery(document).ready(function($){
var adminBarHeight = 0;
if ( $("#wpadminbar").length != 0 ){
var adminBarHeight = $('#wpadminbar').height();
}
var mysticky_welcomebar_height = adminBarHeight + jQuery( '.mysticky-welcomebar-fixed' ).outerHeight();
if( jQuery( '.mysticky-welcomebar-fixed' ).data('position') == 'top' ) {
jQuery( '.mysticky-welcomebar-entry-effect-slide-in.mysticky-welcomebar-fixed' ).css( 'top', '-' + mysticky_welcomebar_height + 'px' );
} else {
jQuery( '.mysticky-welcomebar-entry-effect-slide-in.mysticky-welcomebar-fixed' ).css( 'bottom', '-' + mysticky_welcomebar_height + 'px' );
}
var divi_topbar_height = $( '.et_fixed_nav #top-header' ).outerHeight();
var divi_total_height = mysticky_welcomebar_height + divi_topbar_height;
var welcombar_aftersubmission = $( '.mysticky-welcomebar-fixed' ).data('aftersubmission');
if( welcombar_aftersubmission == 'dont_show_welcomebar' ){
var welcomebar_storage = localStorage.getItem("welcomebar_close");
} else if( welcombar_aftersubmission == 'show_welcomebar_next_visit' ) {
var welcomebar_storage = sessionStorage.getItem("welcomebar_close");
} else {
sessionStorage.removeItem('welcomebar_close');
localStorage.removeItem('welcomebar_close');
var welcomebar_storage = null;
}
if ( welcomebar_storage === null ){
var after_trigger = jQuery( '.mysticky-welcomebar-fixed' ).data('after-triger');
jQuery( 'body' ).addClass( 'mysticky-welcomebar-apper' );
if ( after_trigger == 'after_a_few_seconds' ) {
if ( $( '.mysticky-welcomebar-fixed' ).hasClass( 'mysticky-welcomebar-display-desktop' ) ) {
if ( $( window ).width() > 767 ) {
var trigger_sec = jQuery( '.mysticky-welcomebar-fixed' ).data('triger-sec') * 1000;
var welcombar_position = $( '.mysticky-welcomebar-fixed' ).data('position');
var welcombar_height = $( '.mysticky-welcomebar-fixed' ).outerHeight();
setTimeout(function(){
jQuery( '.mysticky-welcomebar-fixed' ).addClass( 'mysticky-welcomebar-animation' );
$( '.mysticky-welcomebar-fixed' ).addClass( 'entry-effect' );
if ( welcombar_position == 'top' ) {
jQuery( '.mysticky-welcomebar-fixed' ).addClass( 'mysticky-welcomebar-animation' );
jQuery( '.mysticky-welcomebar-fixed' ).css( 'top', (adminBarHeight + 0) + 'px' );
jQuery( '.mysticky-welcomebar-fixed' ).css( 'opacity', '1' );
$( 'html' ).css( 'margin-bottom', '' );
jQuery( '#mysticky_divi_style' ).remove();
jQuery( '.et_fixed_nav #top-header' ).css( 'top', welcombar_height + 'px' );
jQuery( 'head' ).append( '<style id="mysticky_divi_style" type="text/css">.et_fixed_nav #main-header {top: ' + welcombar_height + 'px !important}.et_fixed_nav #top-header + #main-header{top: ' + divi_total_height + 'px !important}</style>' );
$( 'html' ).attr( 'style', 'margin-top: ' + mysticky_welcomebar_height + 'px !important' );
$( '#mysticky-nav' ).css( 'top', mysticky_welcomebar_height + 'px' );
} else {
jQuery( '.mysticky-welcomebar-fixed' ).css( 'bottom', '0' );
jQuery( '.mysticky-welcomebar-fixed' ).css( 'opacity', '1' );
$( 'html' ).css( 'margin-top', '' );
jQuery( '#mysticky_divi_style' ).remove();
jQuery( '.et_fixed_nav #top-header' ).css( 'top', '' );
$( 'html' ).attr( 'style', 'margin-bottom: ' + mysticky_welcomebar_height + 'px !important' );
}
}, trigger_sec );
}
}
}
if ( $( window ).width() < 767 ) {
if ( after_trigger == 'after_a_few_seconds' ) {
if ( $( '.mysticky-welcomebar-fixed' ).hasClass( 'mysticky-welcomebar-display-mobile' ) ) {
var trigger_sec = jQuery( '.mysticky-welcomebar-fixed' ).data('triger-sec') * 1000;
var welcombar_position = $( '.mysticky-welcomebar-fixed' ).data('position');
var welcombar_height = $( '.mysticky-welcomebar-fixed' ).outerHeight();
setTimeout(function(){
jQuery( '.mysticky-welcomebar-fixed' ).addClass( 'mysticky-welcomebar-animation' );
$( '.mysticky-welcomebar-fixed' ).addClass( 'entry-effect' );
jQuery( '#mysticky_divi_style' ).remove();
jQuery( '.et_fixed_nav #top-header' ).css( 'top', '' );
if ( welcombar_position == 'top' ) {
jQuery( '.mysticky-welcomebar-fixed' ).css( 'top', ( adminBarHeight + 0) + 'px' );
jQuery( '.mysticky-welcomebar-fixed' ).css( 'opacity', '1' );
$( 'html' ).css( 'margin-bottom', '' );
$( 'html' ).attr( 'style', 'margin-top: ' + mysticky_welcomebar_height + 'px !important' );
$( '#mysticky-nav' ).css( 'top', mysticky_welcomebar_height + 'px' );
} else {
jQuery( '.mysticky-welcomebar-fixed' ).css( 'bottom', '0' );
jQuery( '.mysticky-welcomebar-fixed' ).css( 'opacity', '1' );
$( 'html' ).css( 'margin-top', '' );
$( 'html' ).attr( 'style', 'margin-bottom: ' + mysticky_welcomebar_height + 'px !important' );
}
}, trigger_sec );
}
}
}
mystickyelements_present();
}
$( window ).resize( function(){
var mysticky_welcomebar_height = jQuery( '.mysticky-welcomebar-fixed' ).outerHeight();
if( welcombar_aftersubmission == 'dont_show_welcomebar' ){
var welcomebar_storage = localStorage.getItem("welcomebar_close");
} else if( welcombar_aftersubmission == 'show_welcomebar_next_visit' ) {
var welcomebar_storage = sessionStorage.getItem("welcomebar_close");
} else {
sessionStorage.removeItem('welcomebar_close');
localStorage.removeItem('welcomebar_close');
var welcomebar_storage = null;
}
if ( welcomebar_storage === null ){
var after_trigger = jQuery( '.mysticky-welcomebar-fixed' ).data('after-triger');
if ( ! $( '.mysticky-welcomebar-fixed' ).hasClass( 'mysticky-welcomebar-notapper' ) ) {
jQuery( 'body' ).addClass( 'mysticky-welcomebar-apper' );
} else {
jQuery( 'body' ).removeClass( 'mysticky-welcomebar-apper' );
}
if ( after_trigger == 'after_a_few_seconds' ) {
var trigger_sec = jQuery( '.mysticky-welcomebar-fixed' ).data('triger-sec') * 1000;
var welcombar_position = $( '.mysticky-welcomebar-fixed' ).data('position');
var welcombar_height = $( '.mysticky-welcomebar-fixed' ).outerHeight();
if ( $( window ).width() < 767 ) {
if ( $( '.mysticky-welcomebar-fixed' ).hasClass( 'mysticky-welcomebar-display-mobile' ) ) {
setTimeout(function(){
jQuery( '.mysticky-welcomebar-fixed' ).addClass( 'mysticky-welcomebar-animation' );
$( '.mysticky-welcomebar-fixed' ).addClass( 'entry-effect' );
jQuery( '#mysticky_divi_style' ).remove();
jQuery( '.et_fixed_nav #top-header' ).css( 'top', '' );
if ( welcombar_position == 'top' ) {
jQuery( '.mysticky-welcomebar-fixed' ).css( 'top', ( adminBarHeight + 0) + 'px' );
jQuery( '.mysticky-welcomebar-fixed' ).css( 'opacity', '1' );
$( 'html' ).css( 'margin-bottom', '' );
$( 'html' ).attr( 'style', 'margin-top: ' + mysticky_welcomebar_height + 'px !important' );
$( '.mysticky-welcomebar-apper #mysticky-nav' ).css( 'top', mysticky_welcomebar_height + 'px' );
} else {
jQuery( '.mysticky-welcomebar-fixed' ).css( 'bottom', '0' );
jQuery( '.mysticky-welcomebar-fixed' ).css( 'opacity', '1' );
$( 'html' ).css( 'margin-top', '' );
$( 'html' ).attr( 'style', 'margin-bottom: ' + mysticky_welcomebar_height + 'px !important' );
}
}, trigger_sec );
}
} else {
if ( $( '.mysticky-welcomebar-fixed' ).hasClass( 'mysticky-welcomebar-display-desktop' ) ) {
setTimeout(function(){
jQuery( '.mysticky-welcomebar-fixed' ).addClass( 'mysticky-welcomebar-animation' );
$( '.mysticky-welcomebar-fixed' ).addClass( 'entry-effect' );
if ( welcombar_position == 'top' ) {
jQuery( '.mysticky-welcomebar-fixed' ).css( 'top', ( adminBarHeight + 0) + 'px' );
jQuery( '.mysticky-welcomebar-fixed' ).css( 'opacity', '1' );
$( 'html' ).css( 'margin-bottom', '' );
jQuery( '#mysticky_divi_style' ).remove();
jQuery( '.mysticky-welcomebar-apper.et_fixed_nav #top-header' ).css( 'top', welcombar_height + 'px' );
jQuery( 'head' ).append( '<style id="mysticky_divi_style" type="text/css">.mysticky-welcomebar-apper.et_fixed_nav #main-header {top: ' + welcombar_height + 'px !important}.mysticky-welcomebar-apper.et_fixed_nav #top-header + #main-header{top: ' + divi_total_height + 'px !important}</style>' );
$( 'html' ).attr( 'style', 'margin-top: ' + mysticky_welcomebar_height + 'px !important' );
$( '.mysticky-welcomebar-apper #mysticky-nav' ).css( 'top', mysticky_welcomebar_height + 'px' );
} else {
jQuery( '.mysticky-welcomebar-fixed' ).css( 'bottom', '0' );
jQuery( '.mysticky-welcomebar-fixed' ).css( 'opacity', '1' );
$( 'html' ).css( 'margin-top', '' );
jQuery( '#mysticky_divi_style' ).remove();
jQuery( '.et_fixed_nav #top-header' ).css( 'top', '' );
$( 'html' ).attr( 'style', 'margin-bottom: ' + mysticky_welcomebar_height + 'px !important' );
}
}, trigger_sec );
}
}
}
mystickyelements_present();
}
} );
jQuery(window).on( 'scroll', function(){
if( welcombar_aftersubmission == 'dont_show_welcomebar' ){
var welcomebar_storage = localStorage.getItem("welcomebar_close");
} else if( welcombar_aftersubmission == 'show_welcomebar_next_visit' ) {
var welcomebar_storage = sessionStorage.getItem("welcomebar_close");
} else {
sessionStorage.removeItem('welcomebar_close');
localStorage.removeItem('welcomebar_close');
var welcomebar_storage = null;
}
if ( welcomebar_storage === null ){
var welcombar_height = $( '.mysticky-welcomebar-fixed' ).outerHeight();
var welcombar_position = $( '.mysticky-welcomebar-fixed' ).data('position');
if ( welcombar_position == 'top' ) {
$( '#mysticky-nav' ).css( 'top', mysticky_welcomebar_height + 'px' );
}
if ( after_trigger === 'after_scroll' ) {
var scroll = 100 * $(window).scrollTop() / ($(document).height() - $(window).height());
var after_scroll_val = jQuery( '.mysticky-welcomebar-fixed' ).data('triger-sec');
var welcombar_position = $( '.mysticky-welcomebar-fixed' ).data('position');
var welcombar_height = $( '.mysticky-welcomebar-fixed' ).outerHeight();
if( scroll > after_scroll_val ) {
if ( $( '.mysticky-welcomebar-fixed' ).hasClass( 'mysticky-welcomebar-display-desktop' ) ) {
if ( $( window ).width() > 767 ) {
jQuery( '.mysticky-welcomebar-fixed' ).addClass( 'mysticky-welcomebar-animation' );
$( '.mysticky-welcomebar-fixed' ).addClass( 'entry-effect' );
if ( welcombar_position == 'top' ) {
jQuery( '.mysticky-welcomebar-fixed' ).css( 'top', (adminBarHeight+ 0 ) + 'px' );
jQuery( '.mysticky-welcomebar-fixed' ).css( 'opacity', '1' );
$( 'html' ).css( 'margin-bottom', '' );
$( 'html' ).attr( 'style', 'margin-top: ' + mysticky_welcomebar_height + 'px !important' );
$( '#mysticky-nav' ).css( 'top', mysticky_welcomebar_height + 'px' );
} else {
jQuery( '.mysticky-welcomebar-fixed' ).css( 'bottom', '0' );
jQuery( '.mysticky-welcomebar-fixed' ).css( 'opacity', '1' );
$( 'html' ).css( 'margin-top', '' );
$( 'html' ).attr( 'style', 'margin-bottom: ' + mysticky_welcomebar_height + 'px !important' );
}
}
}
if ( $( '.mysticky-welcomebar-fixed' ).hasClass( 'mysticky-welcomebar-display-mobile' ) ) {
if ( $( window ).width() < 767 ) {
jQuery( '.mysticky-welcomebar-fixed' ).addClass( 'mysticky-welcomebar-animation' );
$( '.mysticky-welcomebar-fixed' ).addClass( 'entry-effect' );
if ( welcombar_position == 'top' ) {
jQuery( '.mysticky-welcomebar-fixed' ).css( 'top', ( adminBarHeight +0 ) + 'px' );
jQuery( '.mysticky-welcomebar-fixed' ).css( 'opacity', '1' );
$( 'html' ).css( 'margin-bottom', '' );
$( 'html' ).attr( 'style', 'margin-top: ' + mysticky_welcomebar_height + 'px !important' );
$( '#mysticky-nav' ).css( 'top', mysticky_welcomebar_height + 'px' );
} else {
jQuery( '.mysticky-welcomebar-fixed' ).css( 'bottom', '0' );
jQuery( '.mysticky-welcomebar-fixed' ).css( 'opacity', '1' );
$( 'html' ).css( 'margin-top', '' );
$( 'html' ).attr( 'style', 'margin-bottom: ' + mysticky_welcomebar_height + 'px !important' );
}
}
}
}
}
mystickyelements_present();
}
});
jQuery( '.mysticky-welcomebar-close, .mysticky-welcomebar-btn a' ).on( 'click', function(){
if( welcombar_aftersubmission != 'show_welcomebar_every_page' ){
if( welcombar_aftersubmission == 'dont_show_welcomebar' ){
sessionStorage.removeItem('welcomebar_close');
localStorage.setItem('welcomebar_close', 'close');
} else if( welcombar_aftersubmission == 'show_welcomebar_next_visit' ) {
localStorage.removeItem('welcomebar_close');
sessionStorage.setItem('welcomebar_close', 'close');
}
}
var welcombar_position = $( '.mysticky-welcomebar-fixed' ).data('position');
var welcombar_height = $( '.mysticky-welcomebar-fixed' ).outerHeight();
jQuery( '.mysticky-welcomebar-fixed' ).addClass( 'mysticky-welcomebar-notapper' );
jQuery( 'body' ).removeClass( 'mysticky-welcomebar-apper' );
jQuery( '.mysticky-welcomebar-fixed' ).slideUp( 'slow' );
if ( welcombar_position == 'top' ) {
jQuery( '.mysticky-welcomebar-fixed' ).css( 'top', '-' + mysticky_welcomebar_height + 'px' );
} else {
jQuery( '.mysticky-welcomebar-fixed' ).css( 'bottom', '-' + mysticky_welcomebar_height + 'px' );
}
jQuery( '#mysticky_divi_style' ).remove();
jQuery( '.et_fixed_nav #top-header' ).css( 'top', '' );
jQuery( 'html' ).css( 'margin-top', '' );
jQuery( 'html' ).css( 'margin-bottom', '' );
$( '#mysticky-nav' ).css( 'top', '0px' );
/*if mystickyelements show*/
var mystickyelements_show = $( '.mystickyelements-fixed' ).length;
if( mystickyelements_show && $( window ).width() <= 1024 && $( '.mystickyelements-fixed' ).hasClass( 'mystickyelements-position-mobile-top' ) && welcombar_position == 'top' ) {
var mystickyelements_height = $( '.mystickyelements-fixed' ).height();
$( '.mystickyelements-fixed' ).css( 'top', '' );
$( 'html' ).attr( 'style', 'margin-top: ' + mystickyelements_height + 'px !important' );
}
} );
});
function mystickyelements_present() {
var after_trigger = jQuery( '.mysticky-welcomebar-fixed' ).data('after-triger');
var mystickyelements_show = jQuery( '.mystickyelements-fixed' ).length;
var welcombar_position = jQuery( '.mysticky-welcomebar-fixed' ).data('position');
var adminBarHeight = 0;
if ( jQuery("#wpadminbar").length != 0 ){
var adminBarHeight = jQuery('#wpadminbar').height();
}
if ( jQuery( window ).width() <= 600 && jQuery(window).scrollTop() != 0 && welcombar_position == 'top') {
jQuery( '.mysticky-welcomebar-fixed' ).css( 'top', '0px' );
var welcombar_height = jQuery( '.mysticky-welcomebar-fixed' ).outerHeight();
jQuery( '#mysticky-nav' ).css( 'top', welcombar_height + 'px' );
} else if ( welcombar_position == 'top' ) {
var mysticky_welcomebar_height = adminBarHeight + jQuery( '.mysticky-welcomebar-fixed' ).outerHeight();
jQuery( '.mysticky-welcomebar-fixed' ).css( 'top', ( adminBarHeight + 0) + 'px' );
jQuery( '#mysticky-nav' ).css( 'top', mysticky_welcomebar_height + 'px' );
}
if( mystickyelements_show ) {
var welcombar_height = jQuery( '.mysticky-welcomebar-fixed' ).outerHeight();
var mystickyelements_height = jQuery( '.mystickyelements-fixed' ).height();
var mystickyelements_total_height = welcombar_height + mystickyelements_height;
if ( jQuery( window ).width() <= 1024 && jQuery( '.mystickyelements-fixed' ).hasClass( 'mystickyelements-position-mobile-top' ) ) {
if ( after_trigger == 'after_a_few_seconds' ) {
if ( jQuery( '.mysticky-welcomebar-fixed' ).hasClass( 'mysticky-welcomebar-display-mobile' ) ) {
var trigger_sec = jQuery( '.mysticky-welcomebar-fixed' ).data('triger-sec') * 1000;
setTimeout(function(){
if ( welcombar_position == 'top' ) {
jQuery( '.mystickyelements-fixed' ).css( 'top', welcombar_height );
jQuery( 'html' ).attr( 'style', 'margin-top: ' + mystickyelements_total_height + 'px !important' );
} else {
jQuery( '.mystickyelements-fixed' ).css( 'top', '' );
jQuery( 'html' ).attr( 'style', 'margin-bottom: ' + welcombar_height + 'px !important' );
}
}, trigger_sec );
}
} else if ( after_trigger === 'after_scroll' ) {
var scroll = 100 * $(window).scrollTop() / ($(document).height() - $(window).height());
var after_scroll_val = $( '.mysticky-welcomebar-fixed' ).data('triger-sec');
if( scroll > after_scroll_val ) {
if ( jQuery( '.mysticky-welcomebar-fixed' ).hasClass( 'mysticky-welcomebar-display-mobile' ) ) {
if ( welcombar_position == 'top' ) {
jQuery( '.mystickyelements-fixed' ).css( 'top', welcombar_height );
jQuery( 'html' ).attr( 'style', 'margin-top: ' + mystickyelements_total_height + 'px !important' );
} else {
jQuery( '.mystickyelements-fixed' ).css( 'top', '' );
jQuery( 'html' ).attr( 'style', 'margin-bottom: ' + welcombar_height + 'px !important' );
}
}
}
}
}
}
}
jQuery(".mysticky-welcomebar-fixed").on(
"animationend MSAnimationEnd webkitAnimationEnd oAnimationEnd",
function() {
jQuery(this).removeClass("animation-start");
}
);
jQuery(document).ready(function() {
var container = jQuery(".mysticky-welcomebar-fixed");
var refreshId = setInterval(function() {
container.addClass("animation-start");
}, 3500);
});
</script>
<style>
.mysticky-welcomebar-fixed , .mysticky-welcomebar-fixed * {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.mysticky-welcomebar-fixed {
background-color: #03ed96;
font-family: Poppins;
position: fixed;
left: 0;
right: 0;
z-index: 9999999;
opacity: 0;
}
.mysticky-welcomebar-fixed-wrap {
min-height: 60px;
padding: 20px 50px;
display: flex;
align-items: center;
justify-content: center;
width: 100%;
height: 100%;
}
.mysticky-welcomebar-animation {
-webkit-transition: all 1s ease 0s;
-moz-transition: all 1s ease 0s;
transition: all 1s ease 0s;
}
.mysticky-welcomebar-position-top {
top:0;
}
.mysticky-welcomebar-position-bottom {
bottom:0;
}
.mysticky-welcomebar-position-top.mysticky-welcomebar-entry-effect-slide-in {
top: -60px;
}
.mysticky-welcomebar-position-bottom.mysticky-welcomebar-entry-effect-slide-in {
bottom: -60px;
}
.mysticky-welcomebar-entry-effect-fade {
opacity: 0;
}
.mysticky-welcomebar-entry-effect-none {
display: none;
}
.mysticky-welcomebar-fixed .mysticky-welcomebar-content p a,
.mysticky-welcomebar-fixed .mysticky-welcomebar-content p {
color: #000000;
font-size: 16px;
margin: 0;
padding: 0;
line-height: 1.2;
font-family: inherit;
font-weight: 400;
}
.mysticky-welcomebar-fixed .mysticky-welcomebar-btn {
padding-left: 30px;
display: none;
line-height: 1;
}
.mysticky-welcomebar-fixed.mysticky-welcomebar-btn-desktop .mysticky-welcomebar-btn {
display: block;
}
.mysticky-welcomebar-fixed .mysticky-welcomebar-btn a {
background-color: #000000;
font-family: inherit;
color: #ffffff;
border-radius: 4px;
text-decoration: none;
display: inline-block;
vertical-align: top;
line-height: 1.2;
font-size: 16px;
font-weight: 400;
padding: 5px 20px;
white-space: nowrap;
}
.mysticky-welcomebar-fixed .mysticky-welcomebar-btn a:hover {
/*opacity: 0.7;*/
-moz-box-shadow: 1px 2px 4px rgba(0, 0, 0,0.5);
-webkit-box-shadow: 1px 2px 4px rgba(0, 0, 0, 0.5);
box-shadow: 1px 2px 4px rgba(0, 0, 0, 0.5);
}
.mysticky-welcomebar-fixed .mysticky-welcomebar-close {
display: none;
vertical-align: top;
width: 30px;
height: 30px;
text-align: center;
line-height: 30px;
border-radius: 5px;
color: #000;
position: absolute;
top: 5px;
right: 10px;
outline: none;
font-family: Lato;
text-decoration: none;
text-shadow: 0 0 0px #fff;
-webkit-transition: all 0.5s ease 0s;
-moz-transition: all 0.5s ease 0s;
transition: all 0.5s ease 0s;
-webkit-transform-origin: 50% 50%;
-moz-transform-origin: 50% 50%;
transform-origin: 50% 50%;
}
.mysticky-welcomebar-fixed .mysticky-welcomebar-close:hover {
opacity: 1;
-webkit-transform: rotate(180deg);
-moz-transform: rotate(180deg);
transform: rotate(180deg);
}
.mysticky-welcomebar-fixed .mysticky-welcomebar-close span.dashicons {
font-size: 27px;
}
.mysticky-welcomebar-fixed.mysticky-welcomebar-showx-desktop .mysticky-welcomebar-close {
display: inline-block;
}
/* Animated Buttons */
.mysticky-welcomebar-btn a {
-webkit-animation-duration: 1s;
animation-duration: 1s;
}
@-webkit-keyframes flash {
from,
50%,
to {
opacity: 1;
}
25%,
75% {
opacity: 0;
}
}
@keyframes flash {
from,
50%,
to {
opacity: 1;
}
25%,
75% {
opacity: 0;
}
}
.mysticky-welcomebar-attention-flash.animation-start .mysticky-welcomebar-btn a {
-webkit-animation-name: flash;
animation-name: flash;
}
@keyframes shake {
from,
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
10%,
30%,
50%,
70%,
90% {
-webkit-transform: translate3d(-10px, 0, 0);
transform: translate3d(-10px, 0, 0);
}
20%,
40%,
60%,
80% {
-webkit-transform: translate3d(10px, 0, 0);
transform: translate3d(10px, 0, 0);
}
}
.mysticky-welcomebar-attention-shake.animation-start .mysticky-welcomebar-btn a {
-webkit-animation-name: shake;
animation-name: shake;
}
@-webkit-keyframes swing {
20% {
-webkit-transform: rotate3d(0, 0, 1, 15deg);
transform: rotate3d(0, 0, 1, 15deg);
}
40% {
-webkit-transform: rotate3d(0, 0, 1, -10deg);
transform: rotate3d(0, 0, 1, -10deg);
}
60% {
-webkit-transform: rotate3d(0, 0, 1, 5deg);
transform: rotate3d(0, 0, 1, 5deg);
}
80% {
-webkit-transform: rotate3d(0, 0, 1, -5deg);
transform: rotate3d(0, 0, 1, -5deg);
}
to {
-webkit-transform: rotate3d(0, 0, 1, 0deg);
transform: rotate3d(0, 0, 1, 0deg);
}
}
@keyframes swing {
20% {
-webkit-transform: rotate3d(0, 0, 1, 15deg);
transform: rotate3d(0, 0, 1, 15deg);
}
40% {
-webkit-transform: rotate3d(0, 0, 1, -10deg);
transform: rotate3d(0, 0, 1, -10deg);
}
60% {
-webkit-transform: rotate3d(0, 0, 1, 5deg);
transform: rotate3d(0, 0, 1, 5deg);
}
80% {
-webkit-transform: rotate3d(0, 0, 1, -5deg);
transform: rotate3d(0, 0, 1, -5deg);
}
to {
-webkit-transform: rotate3d(0, 0, 1, 0deg);
transform: rotate3d(0, 0, 1, 0deg);
}
}
.mysticky-welcomebar-attention-swing.animation-start .mysticky-welcomebar-btn a {
-webkit-transform-origin: top center;
transform-origin: top center;
-webkit-animation-name: swing;
animation-name: swing;
}
@-webkit-keyframes tada {
from {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
10%,
20% {
-webkit-transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
}
30%,
50%,
70%,
90% {
-webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
}
40%,
60%,
80% {
-webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
}
to {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
}
@keyframes tada {
from {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
10%,
20% {
-webkit-transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
}
30%,
50%,
70%,
90% {
-webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
}
40%,
60%,
80% {
-webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
}
to {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
}
.mysticky-welcomebar-attention-tada.animation-start .mysticky-welcomebar-btn a {
-webkit-animation-name: tada;
animation-name: tada;
}
@-webkit-keyframes heartBeat {
0% {
-webkit-transform: scale(1);
transform: scale(1);
}
14% {
-webkit-transform: scale(1.3);
transform: scale(1.3);
}
28% {
-webkit-transform: scale(1);
transform: scale(1);
}
42% {
-webkit-transform: scale(1.3);
transform: scale(1.3);
}
70% {
-webkit-transform: scale(1);
transform: scale(1);
}
}
@keyframes heartBeat {
0% {
-webkit-transform: scale(1);
transform: scale(1);
}
14% {
-webkit-transform: scale(1.3);
transform: scale(1.3);
}
28% {
-webkit-transform: scale(1);
transform: scale(1);
}
42% {
-webkit-transform: scale(1.3);
transform: scale(1.3);
}
70% {
-webkit-transform: scale(1);
transform: scale(1);
}
}
.mysticky-welcomebar-attention-heartbeat.animation-start .mysticky-welcomebar-btn a {
-webkit-animation-name: heartBeat;
animation-name: heartBeat;
-webkit-animation-duration: 1.3s;
animation-duration: 1.3s;
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
}
@-webkit-keyframes wobble {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
15% {
-webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
}
30% {
-webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
}
45% {
-webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
}
60% {
-webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
}
75% {
-webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes wobble {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
15% {
-webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
}
30% {
-webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
}
45% {
-webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
}
60% {
-webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
}
75% {
-webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
.mysticky-welcomebar-attention-wobble.animation-start .mysticky-welcomebar-btn a {
-webkit-animation-name: wobble;
animation-name: wobble;
}
@media only screen and (min-width: 768px) {
.mysticky-welcomebar-display-desktop.mysticky-welcomebar-entry-effect-fade.entry-effect {
opacity: 1;
}
.mysticky-welcomebar-display-desktop.mysticky-welcomebar-entry-effect-none.entry-effect {
display: block;
}
.mysticky-welcomebar-display-desktop.mysticky-welcomebar-position-top.mysticky-welcomebar-fixed ,
.mysticky-welcomebar-display-desktop.mysticky-welcomebar-position-top.mysticky-welcomebar-entry-effect-slide-in.entry-effect.mysticky-welcomebar-fixed {
top: 0;
}
.mysticky-welcomebar-display-desktop.mysticky-welcomebar-position-bottom.mysticky-welcomebar-fixed ,
.mysticky-welcomebar-display-desktop.mysticky-welcomebar-position-bottom.mysticky-welcomebar-entry-effect-slide-in.entry-effect.mysticky-welcomebar-fixed {
bottom: 0;
}
}
@media only screen and (max-width: 767px) {
.mysticky-welcomebar-display-mobile.mysticky-welcomebar-entry-effect-fade.entry-effect {
opacity: 1;
}
.mysticky-welcomebar-display-mobile.mysticky-welcomebar-entry-effect-none.entry-effect {
display: block;
}
.mysticky-welcomebar-display-mobile.mysticky-welcomebar-position-top.mysticky-welcomebar-fixed ,
.mysticky-welcomebar-display-mobile.mysticky-welcomebar-position-top.mysticky-welcomebar-entry-effect-slide-in.entry-effect.mysticky-welcomebar-fixed {
top: 0;
}
.mysticky-welcomebar-display-mobile.mysticky-welcomebar-position-bottom.mysticky-welcomebar-fixed ,
.mysticky-welcomebar-display-mobile.mysticky-welcomebar-position-bottom.mysticky-welcomebar-entry-effect-slide-in.entry-effect.mysticky-welcomebar-fixed {
bottom: 0;
}
.mysticky-welcomebar-fixed.mysticky-welcomebar-showx-desktop .mysticky-welcomebar-close {
display: none;
}
.mysticky-welcomebar-fixed.mysticky-welcomebar-showx-mobile .mysticky-welcomebar-close {
display: inline-block;
}
.mysticky-welcomebar-fixed.mysticky-welcomebar-btn-desktop .mysticky-welcomebar-btn {
display: none;
}
.mysticky-welcomebar-fixed.mysticky-welcomebar-btn-mobile .mysticky-welcomebar-btn {
display: block;
}
}
@media only screen and (max-width: 480px) {
.mysticky-welcomebar-fixed-wrap {
padding: 15px 36px 35px 10px;
}
.mysticky-welcomebar-fixed .mysticky-welcomebar-btn {
padding-left: 10px;
}
.mysticky-welcomebar-fixed .mysticky-welcomebar-close {
right: 7px;
}
}
body.mysticky-welcomebar-apper #wpadminbar{
z-index:99999999;
}
</style>
<script type="text/javascript">
jQuery(function(){
var arrLiveStats=[];
var WSM_PREFIX="wsm";
jQuery(".if-js-closed").removeClass("if-js-closed").addClass("closed");
var wsmFnSiteLiveStats=function(){
jQuery.ajax({
type: "POST",
url: wsm_ajaxObject.ajax_url,
data: { action: 'liveSiteStats', requests: JSON.stringify(arrLiveStats), r: Math.random() }
}).done(function( strResponse ) {
if(strResponse!="No"){
arrResponse=JSON.parse(strResponse);
jQuery.each(arrResponse, function(key,value){
$element= document.getElementById(key);
oldValue=parseInt($element.getAttribute("data-value").replace(/,/g, ""));
diff=parseInt(value.replace(/,/g, ""))-oldValue;
$class="";
if(diff>=0){
diff="+"+diff;
}else{
$class="wmcRedBack";
}
$element.setAttribute("data-value",value);
$element.innerHTML=diff;
jQuery("#"+key).addClass($class).show().siblings(".wsmH2Number").text(value);
if(key=="SiteUserOnline")
{
var onlineUserCnt = arrResponse.wsmSiteUserOnline;
if(jQuery("#wsmSiteUserOnline").length)
{
jQuery("#wsmSiteUserOnline").attr("data-value",onlineUserCnt); jQuery("#wsmSiteUserOnline").next(".wsmH2Number").html("<a target=\"_blank\" href=\"?page=wsm_traffic&subPage=UsersOnline&subTab=summary\">"+onlineUserCnt+"</a>");
}
}
});
setTimeout(function() {
jQuery.each(arrResponse, function(key,value){
jQuery("#"+key).removeClass("wmcRedBack").hide();
});
}, 1500);
}
});
}
if(arrLiveStats.length>0){
setInterval(wsmFnSiteLiveStats, 10000);
}});
</script><script type="text/javascript" src="https://www.recue.com/wp-content/plugins/mystickymenu/js/detectmobilebrowser.js?ver=2.5.6" id="detectmobilebrowser-js"></script>
<script type="text/javascript" id="mystickymenu-js-extra">
/* <![CDATA[ */
var option = {"mystickyClass":".navbar","activationHeight":"0","disableWidth":"0","disableLargeWidth":"0","adminBar":"false","device_desktop":"1","device_mobile":"1","mystickyTransition":"fade","mysticky_disable_down":"false"};
/* ]]> */
</script>
<script type="text/javascript" src="https://www.recue.com/wp-content/plugins/mystickymenu/js/mystickymenu.min.js?ver=2.5.6" id="mystickymenu-js"></script>
<script type="text/javascript" src="https://www.recue.com/wp-content/plugins/simple-posts-ticker/public/js/jquery.marquee.min.js?ver=1.5.0" id="spt-ticker-js-js"></script>
<script type="text/javascript" src="https://www.recue.com/wp-content/plugins/simple-posts-ticker/public/js/ticker.min.js?ver=1.1.5" id="spt-init-js-js"></script>
<script type="text/javascript" id="ta_main_js-js-extra">
/* <![CDATA[ */
var thirsty_global_vars = {"home_url":"\/\/www.recue.com","ajax_url":"https:\/\/www.recue.com\/wp-admin\/admin-ajax.php","link_fixer_enabled":"yes","link_prefix":"go","link_prefixes":["recommends","go"],"post_id":"31405","enable_record_stats":"yes","enable_js_redirect":"yes","disable_thirstylink_class":""};
/* ]]> */
</script>
<script type="text/javascript" src="https://www.recue.com/wp-content/plugins/thirstyaffiliates/js/app/ta.js?ver=3.10.3" id="ta_main_js-js"></script>
<script type="text/javascript" src="https://www.recue.com/wp-content/themes/affiliate-review/assets/js/jquery.superfish.js?ver=2.1.2" id="jquery-superfish-js"></script>
<script type="text/javascript" src="https://www.recue.com/wp-content/themes/affiliate-review/assets/js/bootstrap.js?ver=6.6.2" id="bootstrap-js-js"></script>
<script type="text/javascript" src="https://www.recue.com/wp-content/themes/affiliate-review/assets/js/owl.carousel.js?ver=6.6.2" id="owl-carousel-js-js"></script>
<script type="text/javascript" src="https://www.recue.com/wp-content/themes/affiliate-review/assets/js/custom.js?ver=6.6.2" id="affiliate-review-custom-scripts-jquery-js"></script>
<script type="text/javascript" src="https://www.recue.com/wp-content/themes/affiliate-review/assets/js/wow.js?ver=6.6.2" id="affiliate-review-wow-jquery-js"></script>
</body>
</html> 