Castro Podcast app

<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml" lang="en-US"> <head> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta charset="utf-8" /> <title>Castro Podcast app</title> <meta name="description" content="Castro makes it easy to manage lots of podcasts and enjoy the best episodes of all your favorite podcasts.">  <meta itemprop="name" content="Castro Podcast app"> <meta itemprop="description" content="Castro makes it easy to manage lots of podcasts and enjoy the best episodes of all your favorite podcasts."> <meta itemprop="image" content="https://castro.fm/assets/Social-Asset-1.jpg">  <meta property="og:url" content="https://castro.fm/"> <meta property="og:type" content="website"> <meta property="og:title" content="Castro Podcast app"> <meta property="og:description" content="Castro makes it easy to manage lots of podcasts and enjoy the best episodes of all your favorite podcasts."> <meta property="og:image" content="https://castro.fm/assets/Social-Asset-1.jpg">  <meta name="twitter:card" content="summary_large_image"> <meta name="twitter:title" content="Castro Podcast app"> <meta name="twitter:description" content="Castro makes it easy to manage lots of podcasts and enjoy the best episodes of all your favorite podcasts."> <meta name="twitter:image" content="https://castro.fm/assets/Social-Asset-1.jpg"> <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no, viewport-fit=cover" /> <meta name="referrer" content="origin-when-cross-origin" /> <link rel="icon" type="image/png" href="/favicon.ico/favicon-48x48.png" sizes="48x48"/> <link rel="icon" type="image/svg+xml" href="/favicon.ico/favicon.svg"/> <link rel="shortcut icon" href="/favicon.ico/favicon.ico"/> <link rel="apple-touch-icon" sizes="180x180" href="/favicon.ico/apple-touch-icon.png"/> <link rel="manifest" href="/site.webmanifest"/> <meta name="application-name" content=" "/> <link rel="alternate" type="application/rss+xml" title="RSS" href="https://castro.fm/feed.rss" /> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <script src="//cdn.jsdelivr.net/jquery.slick/1.5.5/slick.min.js"></script>   <script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start': new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0], j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src= 'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f); })(window,document,'script','dataLayer','GTM-NPGWNZV');</script>  <script> window.dataLayer = window.dataLayer || []; function gtag(){dataLayer.push(arguments);} gtag('js', new Date()); gtag('config', 'UA-139456242-1'); </script> <link href="/assets/css/home.css?version=0.2" rel="stylesheet"> <link href="/assets/css/base.css?version=0.2" rel="stylesheet"> <link href="/assets/css/navbar.css?version=0.2" rel="stylesheet"> <link href="/assets/css/signUp.css?version=0.2" rel="stylesheet"> <link href="/assets/css/footer.css?version=0.2" rel="stylesheet"></head> <body class="homepage" >  <noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-NPGWNZV" height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>  <nav class="navigation"> <div class="wrapper"> <div class="navbar_container"> <div class="mobile-menu-bg"> <img alt="mobile background" src="/assets/images/BLOG_HEADER.png" /> </div> <a class="navbar_logo" href="/"> <img alt="CastroPodcasts logo" src="/assets/images/logo-castro.svg" /> </a> <div class="navbar_links-wrapper"> <div class="navbar_links"> <a href="/#features" class="navbar_item "> Features </a> <a href="/#castro-plus" class="navbar_item "> Castro Plus </a> <a href="/blog" class="navbar_item "> Blog </a> <a href="/promote" class="navbar_item "> Promote </a> <a href="/support" class="navbar_item "> Support </a> <a href="http://castro.fm/download" class="navbar_cta" target="_blank" onclick="gtag('event', 'click', {'event_category': 'download', 'event_label': 'download button navbar'});"><img class="app_store" alt="app store logo" src="/assets/images/Download_on_the_App_Store.svg" /></a> </div> <div class="hamburguer-menu"> <button class="bt-menu" title="Menu"> <span class="hamburguer"> <span class="bar bar-1"></span> <span class="bar bar-2"></span> <span class="bar bar-3"></span> </span> </button> </div> </div> </div> </div> </nav> <div class="home"> <div class="container"> <div class="fold"> <div class="wrapper"> <div class="fold_container"> <div class="fold_text"> <h1>The podcast app for podcast lovers</h1> <p>Castro podcast app makes it easy to manage lots of podcasts and enjoy the best episodes of all your favorite shows.</p> <a href="http://castro.fm/download" target="_blank" onclick="ga('send', 'event', 'Download', 'click', 'download on app store');"><img alt="app store icon" class="app_store app_store--green" src="/assets/images/Download_on_the_App_Store.svg" /></a> </div> <img alt="fold backbround image" class="fold_img" src="/assets/images/fold-mockup.png"/> </div> </div> </div> </div> <div class="container"> <div class="wrapper"> <div class="introduction"> <img alt="girl with dog illustration" class="introduction_img parallax" src="/assets/images/castro_illustration.png"/> <div class="introduction_text"> <h2>Just press play</h2> <p>The magic of Castro podcast app is a single playlist that gives you total control over your listening experience. We call it the Queue. While most podcast apps treat every show the same, Castro podcast app lets you manage your relationship with each show on an individual basis. </p> <p>Your favorite shows get downloaded and added to the queue automatically, while shows you like to be more choosy with get added to an Inbox you can browse later.</p> </div> </div> </div> </div> <div class="review"> <div class="wrapper"> <div class="review_content"> <div class="review_item"> <img alt="star icon" src="/assets/images/star.svg"/> <img alt="star icon" src="/assets/images/star.svg"/> <img alt="star icon" src="/assets/images/star.svg"/> <img alt="star icon" src="/assets/images/star.svg"/> <img alt="star icon" src="/assets/images/star.svg"/> <p class="review_title">I love this app</p> <p class="review_text">"Castro 3 Is a Great I love everything about this app. The design—I love how compact the episodes are in the queue. So many other podcast apps are bloated design-wise, where you can only see 3 or so episodes at a time…”</p> <p class="review_author">ChadAHall</p> </div> <div class="review_item"> <img alt="star icon" src="/assets/images/star.svg"/> <img alt="star icon" src="/assets/images/star.svg"/> <img alt="star icon" src="/assets/images/star.svg"/> <img alt="star icon" src="/assets/images/star.svg"/> <img alt="star icon" src="/assets/images/star.svg"/> <p class="review_title">Absolutely The Best</p> <p class="review_text">"This app is simple, it's beautiful, it's functional, and it manages podcast in a way that jives with how my brain works. It's perfect. Good job Castro!"</p> <p class="review_author">jcarpenter11986</p> </div> <div class="review_item"> <img alt="star icon" src="/assets/images/star.svg"/> <img alt="star icon" src="/assets/images/star.svg"/> <img alt="star icon" src="/assets/images/star.svg"/> <img alt="star icon" src="/assets/images/star.svg"/> <img alt="star icon" src="/assets/images/star.svg"/> <p class="review_title">The Best Podcasting App</p> <p class="review_text">Castro has done a fantastic job at managing the amount of features and the user experience. Many apps just lack the features or worse, they try to jam too much creating bugs and poor interface usability. I can't say how much I appreciate this app.</p> <p class="review_author">dep0we</p> </div> </div> </div> </div> <div class="container"> <div class="wrapper"> <div class="description"> <div class="description_item "> <img alt="mobile image in benefits section" class="description_img description_img--transition" src="https://castro.fm/assets/Phone-1.jpg" /> <div class="description_text"> <h2>The easiest way to manage lots of podcast subscriptions</h2> <p>There are lots of great podcasts out there. The problem is, with tons of podcasts (and much less time) it's hard to track the best episodes and manage everything you want to listen to.</p> <p>Subscribing to a podcast in Castro isn’t a commitment to listen to every episode: When you subscribe to a podcast, new episodes appear in your feed. Quickly scan them, pick the best, and forget the rest. Simple.</p> </div> </div> <div class="description_item description_item--right"> <img alt="mobile image in benefits section" class="description_img description_img--transition" src="https://castro.fm/assets/Phone-2.jpg" /> <div class="description_text"> <h2>A simple, central place to plan your listening</h2> <p>With Castro podcast app, there’s no need to wrangle a roster of playlists or swipe around the player to find out what’s up next. </p> <p>The Queue gives you one place to plan your listening:</p> <ul><li> Quickly add any episodes you want to listen to next to your queue</li><li>Drag and drop to re-order whenever you like</li><li>Press play and listen through — when one episode finishes, the next one plays automatically</li><li>Queued episodes are downloaded automatically when you’re on wifi, so you save cellular data</li></ul> </div> </div> <div class="description_item "> <img alt="mobile image in benefits section" class="description_img description_img--transition" src="https://castro.fm/assets/Phone-3.jpg" /> <div class="description_text"> <h2>A powerful app designed specifically for podcasts</h2> <p>Podcasts aren’t music. Why don’t all podcast apps reflect that? We tuned Castro’s advanced player engine to deliver the best playback experience for podcasts.</p> </div> </div> </div> <div class="features" id="features"> <div class="features_item"> <img alt="Custom playback speeds icon" class="features_img" src="https://castro.fm/homeAssets/Featured_icon_10.svg" /> <h2>Custom playback speeds</h2> <p>Listen at your own pace with customizable playback speeds between 0.8-3x.</p> </div> <div class="features_item"> <img alt="Make every podcast sound great icon" class="features_img" src="https://castro.fm/homeAssets/Featured_icon_7.svg" /> <h2>Make every podcast sound great</h2> <p>Boost the production value of low quality podcasts with Enhance Voices and Mono Mix.</p> </div> <div class="features_item"> <img alt="Enhanced podcast notifications icon" class="features_img" src="https://castro.fm/homeAssets/Featured_icon_5.svg" /> <h2>Enhanced podcast notifications</h2> <p>Start playing straight from push notifications for newly released episodes, and new episodes added to your queue.</p> </div> <div class="features_item"> <img alt="Advanced chapter support icon" class="features_img" src="https://castro.fm/homeAssets/Featured_icon_9.svg" /> <h2>Advanced chapter support</h2> <p>Play, select, or skip chapters. Pre-selection lets you skip what you’re not interested in in advance.</p> </div> <div class="features_item"> <img alt="Save listening time icon" class="features_img" src="https://castro.fm/homeAssets/Featured_icon_4.svg" /> <h2>Save listening time</h2> <p>Save 10-20% of your total listening time (without any change in audio quality) with Trim Silence.</p> </div> <div class="features_item"> <img alt="Beautiful artwork icon" class="features_img" src="https://castro.fm/homeAssets/Featured_icon_8.svg" /> <h2>Beautiful artwork</h2> <p>Full support for podcast episode and dynamic chapter artwork.</p> </div> <div class="features_item"> <img alt="Podcast sharing icon" class="features_img" src="https://castro.fm/homeAssets/Featured_icon_6.svg" /> <h2>Podcast sharing</h2> <p>Easily share any episode straight from the player. Or, use Castro for iMessage to easily share recently played episodes with friends.</p> </div> <div class="features_item"> <img alt="Sideloading icon" class="features_img" src="https://castro.fm/homeAssets/Featured_icon_3.svg" /> <h2>Sideloading</h2> <p>Sometimes, you discover audio that isn’t part of a podcast feed. Sideloading lets you add any audio from the web to your queue with two taps.</p> </div> <div class="features_item"> <img alt="CarPlay icon" class="features_img" src="https://castro.fm/homeAssets/Featured_icon_1.svg" /> <h2>CarPlay</h2> <p>Enjoy your favourite podcasts on the road with Castro’s CarPlay app.</p> </div> <div class="features_item"> <img alt="Apple Watch icon" class="features_img" src="https://castro.fm/homeAssets/Featured_icon_2.svg" /> <h2>Apple Watch</h2> <p>Control playback and browse your queue straight from your wrist.</p> </div> </div> </div> <img alt="bicycle illustration" class="img-separated parallax" src="/assets/images/castro_illustration_2.jpeg"/> <div class="wrapper"> <div class="keypoints parallax-bg"> <h2>Every podcast is different. So is how you enjoy them.</h2> <div class="keypoints_items"> <div class="keypoints_item"> <img alt="keypoint icon" class="keypoints_img" src="https://castro.fm/homeAssets/keypoints/Keypoint_icon_5.svg"/> <p>Auto-queue your favourite shows, so you never miss an episode.</p> </div> <div class="keypoints_item"> <img alt="keypoint icon" class="keypoints_img" src="https://castro.fm/homeAssets/keypoints/Keypoint_icon_3.svg"/> <p>Episode-limit new shows that publish frequently to avoid getting lost in a backlog.</p> </div> <div class="keypoints_item"> <img alt="keypoint icon" class="keypoints_img" src="https://castro.fm/homeAssets/keypoints/Keypoint_icon_2.svg"/> <p>Slow talkers? Set a faster custom playback speed to match your preferred pace.</p> </div> <div class="keypoints_item"> <img alt="keypoint icon" class="keypoints_img" src="https://castro.fm/homeAssets/keypoints/Keypoint_icon_1.svg"/> <p>Set a custom start position for podcasts with repetitive intros.</p> </div> </div> </div> </div> </div> <div class="bg-black castro-plus"> <div class="container"> <div class="wrapper"> <div class="features_plus"> <h2 class="features_title features--plus">Castro Plus <span>+</span></h2> <p class="features_subtitle">Unlock the full power of Castro’s podcast app engine with a subscription to Castro Plus.</p> <div class="features"> <div class="features_item"> <img alt="Sideloading icon" class="features_img" src="https://castro.fm/homeAssets/castroplus/Plus_icon_6.svg" /> <h2>Sideloading</h2> <p>Easily add any audio file from the web to your listening queue. Sideload video to automatically rip the audio and listen later in Castro.</p> </div> <div class="features_item"> <img alt="Trim Silence icon" class="features_img" src="https://castro.fm/homeAssets/castroplus/Plus_icon_5.svg" /> <h2>Trim Silence</h2> <p>No more awkward silences: Save up to 20% of your listening time, without any change to sound quality.</p> </div> <div class="features_item"> <img alt="Enhance Voices icon" class="features_img" src="https://castro.fm/homeAssets/castroplus/Plus_icon_4.svg" /> <h2>Enhance Voices</h2> <p>Dynamically balance episodes to boost quiet voices without increasing louder noises.</p> </div> <div class="features_item"> <img alt="Advanced Chapter Support icon" class="features_img" src="https://castro.fm/homeAssets/castroplus/Plus_icon_3.svg" /> <h2>Advanced Chapter Support</h2> <p>One-tap to listen to the next or previous chapter, and pre-select chapters you don’t want to hear to skip them automatically.</p> </div> <div class="features_item"> <img alt="Mix to Mono icon" class="features_img" src="https://castro.fm/homeAssets/castroplus/Plus_icon_8.svg" /> <h2>Mix to Mono</h2> <p>Castro can re-centre poorly panned recordings, so you don’t have one guest whispering in your left ear, while the other shouts in your right.</p> </div> <div class="features_item"> <img alt="Chapter & Episode Artwork icon" class="features_img" src="https://castro.fm/homeAssets/castroplus/Plus_icon_9.svg" /> <h2>Chapter & Episode Artwork</h2> <p>Castro's fullscreen player showcases episode and unique chapter artwork.</p> </div> <div class="features_item"> <img alt="Per-Podcast Settings icon" class="features_img" src="https://castro.fm/homeAssets/castroplus/Plus_icon_2.svg" /> <h2>Per-Podcast Settings</h2> <p>Tune playback settings to match your favourite shows: Auto-queue new episodes, set custom audio filters, playback speeds, skip repetitive intros, and more.</p> </div> <div class="features_item"> <img alt="Custom App Icons icon" class="features_img" src="https://castro.fm/homeAssets/castroplus/Plus_icon_1.svg" /> <h2>Custom App Icons</h2> <p>Choose from 18 different app icons.</p> </div> </div> </div> </div> </div> <img alt="background shape" class="parallax" src="/assets/images/castroplus-bg.svg"/> </div> <div class="download"> <h2 class="download_title">Download the most powerful podcast app for iPhone</h2> <div class="download_content"> <a href="http://castro.fm/download" target="_blank" onclick="gtag('event', 'click', {'event_category': 'download', 'event_label': 'download button card'});"> <div class="download_card"> <div> <div class="download_borde"></div> <p class="download_price">Free</p> <p class="download_name">Castro</p> <img alt="app castro icon" src="/assets/images/Bitmap.svg"/> <p class="download_description">The podcast app for podcast fanatics</p> </div> <img alt="app store icon" class="app_store app_store--green" src="/assets/images/Download_on_the_App_Store.svg" /> </div> </a> <a href="http://castro.fm/download" target="_blank" onclick="gtag('event', 'click', {'event_category': 'download', 'event_label': 'download button card'});"> <div class="download_card"> <div> <div class="download_borde"></div> <p class="download_price">$24.99/year</p> <p class="download_name">Castro Plus</p> <img alt="castro plus icon" src="/assets/images/Castro_plus_icon.svg"/> <p class="download_description">Advanced playback features, Sideloading, Night Mode, Custom App Icons, and more.</p> </div> <span class="primary_button">In-App Purchase</span> </div> </a> </div> </div> <div class="signUp"> <div class="wrapper"> <h1>Sign up to stay up to date</h1> <p>Get the latest news on Castro product updates and new features.</p> <form action="https://castro.us20.list-manage.com/subscribe/post?u=f2577082c6690c74017b7860a&amp;id=6499ae97f0" method="post" target="_blank"> <input type="email" name="EMAIL" id="tlemail" placeholder="Your email address" class="input" aria-label="Enter your email address"> <input type="submit" name="subscribe" class="button" value="Sign up" onclick="gtag('event', 'click', {'event_category': 'signUp', 'event_label': 'newsletter signUp'});"> </form> <img class="signUp_img" alt="background image of the newsletter" src="/assets/images/Footer_mock.png"/> </div> </div> </div> <div class="footer"> <div class="wrapper"> <div class="footer_container"> <div> <p><span>Castro</span> is the iPhone podcast player for podcast fanatics.</p> <a href="/"><img class="footer_logo" alt="CastroPodcasts logo" src="/assets/images/logo-castro.svg" /></a> </div> <div class="footer_links"> <div class="footer_group"> <a href="/#features">Features</a> <a href="/#castro-plus">Castro Plus</a> <a href="/blog">Blog</a> <a href="/promote">Promote</a> <a href="/support">Support</a> </div> <div class="footer_group"> <a href="/press-kit">Press Kit</a> <a href="/privacy-policy">Privacy Policy</a> <a href="https://mastodon.social/@castropodcasts" target="_blank" rel="noopener me">Mastodon</a> <a href="https://twitter.com/CastroPodcasts" target="_blank" rel="noopener">Twitter</a> <a href="https://www.instagram.com/castropodcasts/" target="_blank" rel="noopener">Instagram</a> </div> <a href="http://castro.fm/download" class="navbar_cta" target="_blank" onclick="gtag('event', 'click', {'event_category': 'download', 'event_label': 'download button footer'});"> <img class="app_store" alt="app store logo" src="/assets/images/Download_on_the_App_Store.svg" /> </a> </div> </div> </div> </div> <script> //Hamburguer Menu $('.bt-menu').on('click', function(e) { e.preventDefault(); $('.navigation').toggleClass('navigation-open'); if($('.navigation.navigation-open').length > 0){ $('body').css('overflow','hidden'); }else{ $('body').css('overflow','inherit'); } }); //close menu $('.navbar_links a').on('click', function(e){ $('.navigation').removeClass('navigation-open'); $('body').css('overflow','inherit'); }) $( window ).resize(function() { if($(window).width() > 768){ $('body').css('overflow','inherit'); } }); $(document).ready( () => { $('body').fadeIn(1000); setTimeout(function() { if(window.location.hash == '#features'){ $([document.documentElement, document.body]).animate({ scrollTop: $(".features").offset().top - 80 }, 1000); $('.navbar_links a').removeClass('active'); $('.navbar_links a[href*="features"]').addClass('active'); }else if(window.location.hash == '#castro-plus'){ $([document.documentElement, document.body]).animate({ scrollTop: $(".features_plus").offset().top - 80 }, 1000); $('.navbar_links a').removeClass('active'); $('.navbar_links a[href*="castro-plus"]').addClass('active'); } }, 500); }) function isInViewport(node) { var rect = node.getBoundingClientRect() return ( (rect.height > 0 || rect.width > 0) && rect.bottom >= 0 && rect.right >= 0 && rect.top <= (window.innerHeight || document.documentElement.clientHeight) && rect.left <= (window.innerWidth || document.documentElement.clientWidth) ) } $(window).scroll(function() { var scrolled = $(window).scrollTop() $('.signUp_img').each(function(index, element) { var initY = $(this).offset().top var height = $(this).height() var endY = initY + $(this).height() // Check if the element is in the viewport. var visible = isInViewport(this) if(visible && $(window).width() > 768) { var diff = scrolled - initY var ratio = Math.round((diff / height) * 5) $(this).css('transform','translate(50%, ' + parseInt(-(ratio * 1.5)) + '%)') } }) }) </script> <script> $(document).ready( () => { $('.review_content').slick({ infinite: false, slidesToShow: 3, slidesToScroll: 1, accessibility: false, responsive: [ { breakpoint: 1300, settings: { slidesToShow: 2 } }, { breakpoint: 600, settings: { slidesToShow: 1, } }, ] }); }) $(window).scroll(function() { var scroll = $(window).scrollTop(); var heightF = $('.features').height(); var features = $('.features').offset().top; var total = heightF + features; var heightP = $('.bg-black').height(); var plus = $('.bg-black').offset().top; var totalP = heightP + plus; if((scroll >= features) && (scroll < total)){ $('.navbar_links a').removeClass('active'); $('.navbar_links a[href*="features"]').addClass('active'); }else if ((scroll >= plus) && (scroll < totalP)){ $('.navigation').addClass('navigation--black'); $('.navigation').removeClass('navigation--white'); $('.navbar_links a').removeClass('active'); $('.navbar_links a[href*="castro-plus"]').addClass('active'); }else if (($("body").length > 0) && (scroll)){ $('.navigation').addClass('navigation--white'); $('.navigation').removeClass('navigation--black'); $('.navbar_links a').removeClass('active'); }else{ $('.navigation').removeClass('navigation--black'); $('.navigation').removeClass('navigation--white'); $('.navbar_links a').removeClass('active'); } /* Check the location of each desired element */ $('.description_img').each( function(i){ var bottom_of_object = $(this).offset().top; var bottom_of_window = $(window).scrollTop() + $(window).height(); if( bottom_of_window > bottom_of_object ){ $(this).animate({'opacity':'1', "top":"0"},500); } }); $('.description_text').each( function(i){ var bottom_of_object = $(this).offset().top; var bottom_of_window = $(window).scrollTop() + $(window).height(); if( bottom_of_window > bottom_of_object ){ $(this).animate({'opacity':'1'},1500); } }); $('.features_item').each( function(i){ var bottom_of_object = $(this).offset().top; var bottom_of_window = $(window).scrollTop() + $(window).height(); if( bottom_of_window > bottom_of_object ){ $(this).animate({'opacity':'1'},500); } }); $('.features_img').each( function(i){ var bottom_of_object = $(this).offset().top; var bottom_of_window = $(window).scrollTop() + $(window).height(); if( bottom_of_window > bottom_of_object ){ $(this).css('transform','scale(1)'); } }); $('.keypoints_item').each( function(i){ var bottom_of_object = $(this).offset().top; var bottom_of_window = $(window).scrollTop() + $(window).height(); if( bottom_of_window > bottom_of_object ){ $(this).animate({'opacity':'1'},500); } }); }); $('a[href*="#features"]').on('click', function(e){ if($(window).width() < 768){ $([document.documentElement, document.body]).animate({ scrollTop: $(".features").offset().top - 100 }, 1000); }else{ $([document.documentElement, document.body]).animate({ scrollTop: $(".features").offset().top - 100 }, 800); } $('.navbar_links a').removeClass('active'); $('.navbar_links a[href*="features"]').addClass('active'); }) $('a[href*="#castro-plus"]').on('click', function(e){ if($(window).width() < 768){ $([document.documentElement, document.body]).animate({ scrollTop: $(".features_plus").offset().top - 80 }, 2000); }else{ $([document.documentElement, document.body]).animate({ scrollTop: $(".features_plus").offset().top - 80 }, 1000); } $('.navbar_links a').removeClass('active'); $('.navbar_links a[href*="castro-plus"]').addClass('active'); }) function isInViewport(node) { var rect = node.getBoundingClientRect() return ( (rect.height > 0 || rect.width > 0) && rect.bottom >= 0 && rect.right >= 0 && rect.top <= (window.innerHeight || document.documentElement.clientHeight) && rect.left <= (window.innerWidth || document.documentElement.clientWidth) ) } $(window).scroll(function() { var scrolled = $(window).scrollTop() $('.parallax').each(function(index, element) { var initY = $(this).offset().top var height = $(this).height() var endY = initY + $(this).height() // Check if the element is in the viewport. var visible = isInViewport(this) if(visible) { var diff = scrolled - initY var ratio = Math.round((diff / height) * 20) if($(this)[0].className.indexOf('introduction_img') == 0){ if($(window).width() < 1024 && $(window).width() > 768){ ratio = Math.round((diff / height) * 20) $(this).css('transform','translate(-15%, ' + parseInt(-(ratio * 1.5)) + 'px)') }else if($(window).width() > 768){ $(this).css('transform','translate(50%, ' + parseInt(-(ratio * 1.5)) + 'px)') } }else if($(this)[0].className.indexOf('img-separated') == 0){ if($(window).width() > 768){ ratio = Math.round((diff / height) * 5) $(this).css('transform','translate(20px, ' + parseInt(-ratio) + '%)') } }else{ ratio = Math.round((diff / height) * 5) $(this).css('transform','translate(-25rem, ' + parseInt(-ratio) + '%)') } } }) $('.parallax-bg').each(function(index, element) { var initY = $(this).offset().top + 80 var height = $(this).height() var endY = initY + $(this).height() // Check if the element is in the viewport. var visible = isInViewport(this) if(visible) { var diff = scrolled - initY var ratio = Math.round((diff / height) * 10) if($(this)[0].className.indexOf('keypoints') == 0){ if($(window).width() > 768){ $(this).css('background-position','center '+parseInt(-(ratio * 1.5) +120) + '%') }else{ $(this).css('background-position','bottom '+parseInt(-(ratio * 1.5)) + '%') } } } }) }) </script> </body> </html>

CINXE.COM

Castro Podcast app