+ Start a Discussion
laxmi narayan 11laxmi narayan 11 

Using static resource

Hi, All
how can I use a static resource image using jquery in visual force page?
Shruti SShruti S
You can access as following:
<apex:image url="{!URLFOR($Resource.imageFile)}"/>
Prema -Prema -
Firstly you need to upload the JQuery zip file to the Static Resource and then you can wirte the script like this 
          <apex:includeScript value="{! $Resource.jQuery }"/>
    <apex:includeScript value="{!URLFOR($Resource.jQueryMobile,'jquery.mobile-1.4.5/jquery.mobile-1.4.5.js')}"/>
                  <apex:image alt="eye" title="eye"
                 url="{!URLFOR($Resource.jQueryMobile, 'jquery.mobile-1.4.5/images/icons-png/eye-black.png')}"/>
            <apex:image alt="heart" title="heart"
                 url="{!URLFOR($Resource.jQueryMobile, 'jquery.mobile-1.4.5/images/icons-png/heart-black.png')}"/>

Here the Jquery file is JQueryMobile and the I have saved with jquery.mobile-1.4.5 so I have taken this one but inside the <apex:image , if it won't work then you can do like this 
 <apex:image alt="heart" title="heart"
                 url="{!URLFOR($Resource.jQueryMobile, '/images/icons-png/heart-black.png')}"/>

/images/ etc.. or you can also exclude /images only use icons-png/hear-black.png. 
Hope this would work.
Hi Laxminarayan,

Try for some step.
1.Any image save in zip file.
2. Click On Setup.
3. Search in Quick Action 'Static resource'.
4. Click on new and select the 'Zip file' with a name.
5. Cash control must be public.
    <apex:form >
        <apex:pageBlock >
            <apex:pageBlockSection >
     <apex:pageBlockSectionItem >
                    <apex:image url="{!URLFOR($Resource.CALogo, 'CALogo.jpg')}" width="200" height="100" />
   </apex:pageBlockSection >

User-added image

Hope it might help you.