+ Start a Discussion
Steven MaySteven May 

Developer Trail Beginner - Visualforce Basics - Using Static Resources - Examples Bug

I was having issues getting the "jQueryMobileResources"  Visual Force example code to work properly in the Using Static Resources module.

None of the images,CSS or JS files were being found in the .zip file.  In other words I was not getting the expected results as depicted in the trail head.  If you attempt to pull up the url/path directly in the browser I was getting HTTP 404 not found errors.

If none of the static images are being being found in the zip file, prefix the path with the root directory of the zip file.

For example:
<apex:image alt="eye" title="eye" url="{!URLFOR($Resource.jQueryMobile, 'images/icons-png/eye-black.png')}"/>

should be:

<apex:image alt="eye" title="eye" url="{!URLFOR($Resource.jQueryMobile, 'images/icons-png/eye-black.png')}"/>

The root directy for the downloaded jQuery Mobile 1.4.4 is "jquery"

So the actual code would be

<apex:image alt="eye" title="eye" url="{!URLFOR($Resource.jQueryMobile, 'jquery/images/icons-png/eye-black.png')}"/>

Hope this helps if someone else is not getting the Using Static Resource module example code working properly.

Jairaj SinghJairaj Singh
Good Catch,  You can also to add jquery.mobile-1.4.4 infront of images like. 
  <apex:image alt="eye" title="eye"
               url="{!URLFOR($Resource.jQueryMobile, 'jquery.mobile-1.4.4/images/icons-png/eye-black.png')}"/> 
           <apex:image alt="heart" title="heart"
               url="{!URLFOR($Resource.jQueryMobile, 'jquery.mobile-1.4.4/images/icons-png/heart-black.png')}"/> 
           <apex:image alt="cloud" title="cloud"
               url="{!URLFOR($Resource.jQueryMobile, 'jquery.mobile-1.4.4/images/icons-png/cloud-black.png')}"/> 
Rodrigo RodriguesRodrigo Rodrigues
i still having this problem even with the change
Andrii DmytriievAndrii Dmytriiev

I resolved this problem after removing "jquery.mobile-1.4.5" in url path... for example:
url="{!URLFOR($Resource.jQueryMobile, 'images/icons-png/eye-black.png')}"
instead of
url="{!URLFOR($Resource.jQueryMobile, 'jquery.mobile-1.4.5/images/icons-png/eye-black.png')}"

John ShaulJohn Shaul

I don't know if I didn't create the zipped folder and/or static resource as they expected, but what I found was that I needed to remove the jquery from all the urls. So I changed from the code in the trailhead - 

            url="{!URLFOR($Resource.jQueryMobile, 'jquery/images/icons-png/eye-black.png')}"/>
            url="{!URLFOR($Resource.jQueryMobile, 'jquery/images/icons-png/heart-black.png')}"/>
            url="{!URLFOR($Resource.jQueryMobile, 'jquery/images/icons-png/cloud-black.png')}"/>
                url="{!URLFOR($Resource.jQueryMobile, 'images/icons-png/eye-black.png')}"/>
                url="{!URLFOR($Resource.jQueryMobile, 'images/icons-png/heart-black.png')}"/>
                url="{!URLFOR($Resource.jQueryMobile, 'images/icons-png/cloud-black.png')}"/>