ModX: Display static resource image

Question

I have Static Resources whose content points to image files uploaded through ModX content manager. I created JPG and PNG content types and have set it to the Static Resource along with Content disposition Inline.

My goal is to display the images with the help of a plugin/chunk.

The plugin looks like:

$adds = $modx->getCollection('modResource', array('parent'=>44));
$output = "";
foreach ($adds as $add) {
  $properties = $add->toArray();
  $properties['base_url'] = $modx->getOption('base_url');
  $output .= $modx->getChunk('advertisement', $properties);
}
return "<div id='add-slider-wrapper'><div id='add-slides'><ul class='add-slides-container'>" . $output . "</ul></div></div>";

And my 'advertisement' chunk:

<li>
  <a href="[[+description]]">
    <img src="[[+base_url]][[+content]]" alt="" />
  </a>
</li>

However this is not working. Here is what ModX outputs for a static resource:

<img src="/huayang/Images/Advertisements/04.jpg" alt="" width="0" height="0" style="display: none !important; visibility: hidden !important; opacity: 0 !important; background-position: 1px 1px;">

Why does it add those inline styles?

Besides, I can see in the network tab that something is wrong, see the screenshots below:

What am I doing wrong?

Answer 1

It was AdBlock blocking the images download because of "Advertisements" in the files' path! It was adding the inline styles as well.

This post helped me find this out..