Support » Plugin: Better Image Credits » Overlay issue

  • Resolved Dave

    (@dvaer)


    Hi,

    This plugin is exactly what I need, but I have a styling issue with the overlay effect.

    I’d like to position the credits-overlay div over the image and I’m comfortable with the CSS for that. But my problem is that the credits-overlay div is outside the attachment div, which makes it impossible to position it relative to the attachment div.

    Is there a way to get the overlay div inside the attachment div?

    Below is some example code from my site.

    <div id="attachment_97" class="wp-caption alignnone" style="width: 406px">
    <a class="img" href="/wp-content/uploads/2014/01/image.jpg">
    <img class="size-full wp-image-97" width="400" height="600" src="/wp-content/uploads/2014/01/image.jpg" alt="">
    </a>
    <p class="wp-caption-text">Caption text</p>
    </div>
    <div class="credits-overlay" data-target=".wp-image-97">
    <a href="#credit-link">Credit Name</a>
    </div>

    Big thank you for any help.

    http://wordpress.org/plugins/better-image-credits/

Viewing 2 replies - 1 through 2 (of 2 total)
  • Dave

    (@dvaer)

    Clarification:

    So instead of this output:

    <div id="attachment_97" class="wp-caption alignnone" style="width: 406px">
         <a class="img" href="/wp-content/uploads/2014/01/image.jpg">
              <img class="size-full wp-image-97" width="400" height="600" src="/wp-content/uploads/2014/01/image.jpg" alt="">
         </a>
         <p class="wp-caption-text">Caption text</p>
    </div>
    
    <div class="credits-overlay" data-target=".wp-image-97">
         <a href="#credit-link">Credit Name</a>
    </div>

    Is it possible to get this output:

    <div id="attachment_97" class="wp-caption alignnone" style="width: 406px">
         <a class="img" href="/wp-content/uploads/2014/01/image.jpg">
              <img class="size-full wp-image-97" width="400" height="600" src="/wp-content/uploads/2014/01/image.jpg" alt="">
         </a>
         <p class="wp-caption-text">Caption text</p>
    
         <div class="credits-overlay" data-target=".wp-image-97">
              <a href="#credit-link">Credit Name</a>
         </div>
    </div>

    Thanks again 🙂

    Dave

    (@dvaer)

    I’m unsure what was happening, but updating the plugin to version 1.1 seems to have solved the issue.

    The credits-overlay code is now placed at the bottom of the page just before the closing </body> tag. Then some javascript places it over the image, which is perfect for me.

    I may have seen a caching issue when I first installed the plugin. Or the plugin author may have addressed the issue. I don’t know. Anyway it works for me now, so thanks!

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Overlay issue’ is closed to new replies.