Sign in Register
Copied to clipboard

Flag this post as spam?

This post will be reported to the moderators as potential spam to be looked at


  • Jason Espin 368 posts 1335 karma points
    Jul 07, 2015 @ 08:49
    Jason Espin
    0

    Slimy remove src attribute and adds data-src - No images displayed

    Hi all,

    I have just added Slimsy to my Umbraco project. I have used it before and it has worked absolutely fine but the latest version doesn't appear to be working for me at all.

    I've added the following two scripts to the header of my page:

    <script src="~/scripts/slimmage.settings.min.js"></script>
<script src="~/scripts/slimmage.min.js"></script>

    I have then called my code as follows:

    @if (item.HasValue("newsImage"))
{
   int itemId = item.GetPropertyValue<int>("newsImage");
   IPublishedContent image = Umbraco.TypedMedia(itemId);
   <img src="@image.GetResponsiveImageUrl(200, 200)" alt="@image.Name"/> 
 }

    This is all well and good except it returns the following HTML:

     <img alt="Test Image" data-src="/media/1003/penguins.jpg?anchor=center&amp;mode=crop&amp;quality=90&amp;width=200&amp;heightratio=1&amp;format=jpg&amp;slimmage=true&amp;rnd=130807346390000000" data-slimmage="true">

    This is wrong. The Url should be in the src attribute which seems to have been removed by Slimsy so what is going on here?

    Copy Link
  • Jeavon Leopold 3074 posts 13632 karma points MVP 11x admin c-trib
    Jul 08, 2015 @ 21:36
    Jeavon Leopold
    0

    Hi Jason,

    Is that html from view source or from the DOM inspector?

    Jeavon

    Copy Link
  • Pedro Adão 43 posts 80 karma points
    Nov 03, 2016 @ 17:57
    Pedro Adão
    0

    Hi,

    The same happens to me.

    In desktop works great. On mobile no image.

    I have this in the cshtml file:

    <img src="@img.GetResponsiveImageUrl(756, 472)" alt="@img.Name" />

    desktop:

    <img data-src="/media/1800/dscf1451.jpg?anchor=center&amp;mode=crop&amp;width=756&amp;heightratio=0.6243386243386243386243386243&amp;format=jpg&amp;quality=90&amp;slimmage=true&amp;rnd=131206686180000000" alt="DSCF1451.jpg" data-slimmage="true" src="/media/1800/dscf1451.jpg?anchor=center&amp;mode=crop&amp;width=1600&amp;heightratio=0.6243386243386243386243386243&amp;format=jpg&amp;quality=80&amp;slimmage=true&amp;rnd=131206686180000000" data-pixel-width="1600">

    mobile:

    <img data-src="/media/1800/dscf1451.jpg?anchor=center&amp;mode=crop&amp;width=756&amp;heightratio=0.6243386243386243386243386243&amp;format=jpg&amp;quality=90&amp;slimmage=true&amp;rnd=131206686180000000" alt="DSCF1451.jpg" data-slimmage="true">
    Copy Link
  • Pedro Adão 43 posts 80 karma points
    Nov 03, 2016 @ 18:02
    Pedro Adão
    1

    Hi,

    Add style="max-width: 100%;"

    for some reason the master CSS file did "max-width: none;".

    Copy Link
Please Sign in or register to post replies

Write your reply to:

Draft