Here's what we use http://lancasteronline.com/before-and-after-of-deadly-home-explosion-in-manor-township/html_867fffc2-5ff8-11e7-b357-a74cc46b8066.html

I don't know that's it any better or worse than JuxtaposeJS. It's just what we found when we first started doing this a few years ago.

Our code uses jQuery UI and copies of jQuery UI Touch Punch and the jQuery beforeafter plugin that live in our /app directory. https://lancasteronline.com/app/beforeafter also has the green slider (handle.gif) and white arrows (lt-small.png, rt-small.png).

This is the code for the HTML asset that we created for the home explosion:

<script src="https://code.jquery.com/ui/1.11.2/jquery-ui.js"></script>
<script type="text/javascript" src="https://lancasteronline.com/app/jquery-ui-touch-punch-master/jquery.ui.touch-punch.min.js"></script>
<script type="text/javascript" src="https://lancasteronline.com/app/beforeafter/js/jquery.beforeafter-1.4.js"></script>
<style>
.beforeafterwrapper {
   margin: 0 auto 2em auto;
   width: 90%;
   max-width: 600px;
}
.before-after-instructions {
font-size: 1.4em;
}
</style>
<div class="before-after-instructions">Use the vertical green slider in the middle of the photos to see before and after photos of the home that was destroyed in Manor Township.</div>
<script type="text/javascript">
$(function(){
    $('#container').beforeAfter({imagePath:'https://lancasteronline.com/app/beforeafter/'});
});
</script>
<div class="beforeafterwrapper">
 <div id="container">
  <div><img alt="before" src="https://bloximages.newyork1.vip.townnews.com/lancasteronline.com/content/tncms/assets/v3/editorial/7/8b/78b0a6f8-5ff8-11e7-8c80-035470a76f7e/595a4ed3e8b97.image.png" width="100%"></div>
  <div><img alt="after" src="https://bloximages.newyork1.vip.townnews.com/lancasteronline.com/content/tncms/assets/v3/editorial/7/9b/79b6d8c4-5ff8-11e7-b86a-bff9b853fa5b/595a4ed5a3fd3.image.png" width="100%"></div>
</div>
<div class="before-after-caption">
Before: 206 Springdale Lane, near Millersville. (Adam Missimer photo) <br>
After: Debris is shown after a gas explosion destroyed the home. </div>
</div>

We could have multiple images in one HTML asset like at the bottom of this page http://lancasteronline.com/beforeafter/:

<script type="text/javascript">
$(window).bind("load", function() {
        $('#container1').beforeAfter({imagePath:'https://lancasteronline.com/app/beforeafter/'});
        $('#container2').beforeAfter({imagePath:'https://lancasteronline.com/app/beforeafter/'});
});
</script>
<div class="beforeafterwrapper">
 <div id="container1">
  <div><img alt="before" src="https://lancasteronline.com/app/beforeafter/pennsquarebefore.jpg" width="100%"></div>
  <div><img alt="after" src="https://lancasteronline.com/app/beforeafter/pennsquareafter.jpg" width="100%"></div>
 </div>
<div class="before-after-caption">
Before: Penn Square in 1974.<br>
After: Penn Square in 2015. (Richard Hertzler/Staff)</div>
</div>
<div class="beforeafterwrapper">
 <div id="container2">
  <div><img alt="before" src="https://lancasteronline.com/app/beforeafter/maplegrovebefore.jpg" width="100%"></div>
  <div><img alt="after" src="https://lancasteronline.com/app/beforeafter/maplegroveafter.jpg" width="100%"></div>
 </div>
<div class="before-after-caption">
Before: Maple Grove building in 1972.<br>
After: Maple Grove building in 2015. (Richard Hertzler/Staff)</div>
</div

One thing I've found that may help you is that if you set your Main navigation position in the Page customizations to Static,

 you will get two regions at the top of the homepage. One is front-skyline and the other is global-skyline. I think putting your homepage ad blocks in the front-skyline region may get you what you want in terms of putting the ad at the very top of the page. Of course this means your nav flows out of site as you scroll down the page. I don't know if that's something you want.

Skyline would put it at the very top but only for assets. It wouldn't put it on the homepage or any section pages. Can you give me the URL for your site? 

Which site style and wireframe grid are you using? And do you want the ad above the nav and masthead? I'm asking these questions to see if I can help you come up with something, not because I have any obvious answers.

Do you want the ad blocks on all pages, section fronts and assets, or do you just want them on assets? The reason I ask is that I believe the utility regions only show up on asset pages, so anything that you put in there would not show up on a section front or the homepage.

That said, I think there is a bug with the Top of Main Container region.

If you just want the ad blocks on the assets and you want them at the top of the page, did you try use Skyline utility region?

We have our own closings set up that allows an organization to update its status or internal people can do it for one or multiple orgainzations. That's why I suggested adding the banner. We have a script that checks our database to see if anything is not open and shows the banner if needed.

Something that also would help us is multiple language support because we use the data on our http://lancasteronline.com/closings/ page and on our https://www.lavozlancaster.com/cierres/ page. But I'm guessing that wouldn't be needed by a lot of other TN sites.

One thing I would add is the need to generate a link/banner on the homepage or any other pages when any listing is marked as closed/delayed. This banner would send people to the page with  they all of the listings and where they could search for specific ones. That way no one would have to monitor the list to decide that the banner is needed and the banner wouldn't need to be on the page when everything is open.

We had to create a specific URL for each person. I'm not aware of any way to dynamically create the pages.

I'm not aware of a block that automatically pulls in the author bio information, but you can create a block that has just the assets of one author by adding the query rule "Author" to the block and selecting the user you want. That's how we built pages like this https://www.flyafter5.com/staff/kevin-stairiker/ for our staff. At the top we have a Utility: Text promo block with the writer's photo and bio information. Then the rest of the page has Card: Grid blocks with the "Author is" query rule set to this particular person.

We'd also like to see an Instagram button to insert posts into articles similar to the way we can insert tweets.