1

In my local browser I had a jquery dialog box that displays fine, using the default theme. When I publish the site, however, the cross is missing from the close button.

When I check the live site, it has the correct icon images in the correct folder, and it can display them as expected if you navigate to the URL.

To my surprise, when I inspect the element in Chrome, I see that both sites have the same style applied:

.ui-button .ui-icon {
    background-image: url(images/ui-icons_777777_256x240.png);
}

But if you hover over the url, the two resolve differently. 

https://[live]/Content/images/ui-icons_777777_256x240.png

https://[local]/Content/themes/base/images/ui-icons_777777_256x240.png

The bottom one - where the local site is looking - is correct. The other location is empty.

As far as I'm aware, there's no setting or anything else that I've changed to control this behaviour. Why is jQuery looking in two different places?

Bob Tway
  • 9,301
  • 17
  • 80
  • 162
  • 1
    Are you using files (same jquery as in local) or cdn for your live site? – Dejan.S Sep 28 '17 at 09:57
  • @Dejan.S files, on both – Bob Tway Sep 28 '17 at 09:58
  • 4
    css paths are relative the the css file you include. Maybe this helps? I could think of concatenating css in production causing this errors. – Roland Starke Sep 28 '17 at 09:58
  • @RolandStarke That's possible. The files are being bundles and minified in the live site. Will have a dig. – Bob Tway Sep 28 '17 at 09:59
  • @RolandStarke that seems to be the issue - if I turn off minification, it works as expected. You can post that as an answer if you like, although ideally I'd like to to minify *and* work :) – Bob Tway Sep 28 '17 at 10:05
  • 1
    @MattThrower: What technology are you using to bundle the files? If it's ASP.NET MVC, you just need to add a `CssRewriteUrlTransform` to the bundle definition, [as described here](https://stackoverflow.com/a/20491803/124386). – Richard Deeming Sep 28 '17 at 11:39

0 Answers0