Issue with Background Image on Mobile Device

Discussion in 'General Muse' started by khuckabuck, Jan 12, 2017.

  1. khuckabuck

    khuckabuck Member

    6
    0
    Greetings,

    I have just discovered Muse and am having a great time learning to use the program. I have ran into one small issue in regards to the background image.

    I am using Adobe Muse CC 2017.0 Release.
    I have break points set at 2000, 1400, 1040, and 320. All my background images look great in the breakpoints except for the 320.

    The image doesn't scale and it seems blown up.

    An example of the image can be viewed at keithhuckabay.com. The site is not complete as I am trying to fix this issue before proceeding with the rest of the site.

    I have attached a screen shot from my phone as an example of what is happening.

    Any help would be greatly accepted and appreciated.
     

    Attached Files:

  2. DjHerold

    DjHerold Moderator Staff Member Advisory Group

    3,459
    255
    khuck, I just viewed your test site on my Android and had not issues at all.
    As a test, try adding a break point at say 550 and let me know how that looks on your mobile.
    Dj
     
  3. khuckabuck

    khuckabuck Member

    6
    0
    DjHerold,

    Thank you for your response. I took your advice and added a breakpoint at 550. It is doing the same thing. I have tested on an iPhone 7 and iPhone 7 plus. Just as an FYI, before I added the 550 breakpoint, I deleted the one at 320. I assume that is ok to do?

    I am perplexed as to what could be causing this.

    Thanks,
    Keith
     
  4. DjHerold

    DjHerold Moderator Staff Member Advisory Group

    3,459
    255
    Keith, I wish hoping that you may have gotten a different result at the 550 BP, with also having the 320 BP.
    Could you explain how you're doing your background image is it using a background fill or are you filling a rectangle, it would help to know that thanks
    Dj
     
  5. khuckabuck

    khuckabuck Member

    6
    0
    I am using it as a rectangle fill. I guess I am not aware of background fill.

    Thanks,
    Keith
     
  6. DjHerold

    DjHerold Moderator Staff Member Advisory Group

    3,459
    255
    khuck, I'm still not seeing an issue from my end, so recreating it is a struggle.
    You could try using one of the responsive widgets that are typically a slideshow, but you can use them with one image and at full screen.
    Other than that, the team might be able to see something in your file (resources>contact us).
    Dj
     
  7. khuckabuck

    khuckabuck Member

    6
    0
    Thanks,

    I created a one image slideshow and that seemed to work. Now, is there a way to have that slideshow stay in place and have the other elements scroll in front of it?

    I tried placing elements on another layer and have the slideshow pinned to the top, however, that is not seeming to work.

    Thanks for all your help, it is greatly appreciated.

    Keith
     
  8. James007

    James007 Active Member

    25
    1
    Hey Keith, would you mind uploading your .muse file and I'll load it up and have a look for you mate. I had a similar problem recently and I think I found out it's because of an odd layering issue - but just upload your project file and I'll have a look :)
     
  9. khuckabuck

    khuckabuck Member

    6
    0
    James,

    Thank you for agreeing to look into this. Here is a link to the two .muse files:

    https://www.dropbox.com/sh/u4andlt1bsuohqf/AABJhh_4KT9l3wrSjRxdPDH4a?dl=0

    keithhuckabay.muse is the original file that had the image as a background fill in a rectangle shape.
    KeithHuckabay2.muse is one with the slideshow.

    I would prefer to use keithhuckabay.muse as that is able to have scroll effects added to it. I am not able to figure out how to add scroll effects to a slideshow.

    Thanks again,
    Keith
     
  10. James007

    James007 Active Member

    25
    1
    What a strange issue. I haven't seen that before, but I'm working on a workaround for you now. I think a video is the best way of showing what's going wrong with the image quality as the breakpoints kick in:
    https://sendvid.com/t95l2fx0

    *added
    My workaround idea failed. I was going to replace your photo in the 550 and 350 breakpoints with a new image and give them the same scroll effects - but unfortunately I got the same result. I have found these 2 Adobe forum posts which might steer us in the right direction though:
    https://forums.adobe.com/thread/2119888
    https://forums.adobe.com/thread/2140014

    And this one from Muse-Themes:
    http://forum.muse-themes.com/threads/blurred-images-using-muse-responsive.546/
     
    Last edited: Jan 15, 2017
  11. khuckabuck

    khuckabuck Member

    6
    0
    Thank you for your efforts and time to help me resolve this issue.

    I think I may have solved the issue. By removing the rectangles with the background fills and dragging and resizing the images directly into Muse, I have been able to keep the image quality and size at each breakpoints. I have uploaded just the test file and looked at it on my smartphone and it seems to be working the way I envisioned it.

    Once again, thank you all for your time and efforts, you are awesome for helping my out with this.

    Sincerely,
    Keith
     

Share This Page