[xwiki-users] new application css+image
Hello friends, I am trying to use the work of Mark Strauss (mktree) found at http://www.javascripttoolbox.com/lib/mktree/ in xwiki application/plugin that allows creation of collapsible tree from a static ul and lit list. So far, I had it working through by adding the javascript and the css file by adding the actual path of these files in the "presentation" section of the admin dashboard. However, I wanted it to be more organized and make it available on demand. So i created the jsx and the ssx files in place of the javascript and the css files. So far so good. However, there are images that were referred by the css file which worked fine in the previous setup (basically they assign a plus and minus sign on the right of the ul and li elements). Now, I've attached these image files to the ssx. But I am not able to get the ssx to work with the images. The Javascript works fine from the jsx. The tree does collapse and expand as expected. However, the images from the style sheet does not show up. I've used the following line in the "object" edit mode of the ssx page: ul.mktree li.liOpen .bullet { cursor: pointer; background: url($xwiki.getAttachmentURL("minus.gif")) center left no-repeat; } ...here minus.gif is attached to the ssx page. But no go. I did go through the various resources on skin customizations and the addsizes extension tutorial. I could not understand the "use velocity to attach images" technique in the addsizes tutorial. Is there a simpler way to make the ssx pick up the image files and behave just like a normal css file?... Any help would be appreciated. Thank you all.
Hello, If "minus.gif" is attached to the document that holds the SSX object, the right line is : ul.mktree li.liOpen .bullet { cursor: pointer; background: url($doc.getAttachmentURL("minus.gif")) center left no-repeat; } ($doc instead of $xwiki) Make sure you also said "Yes" to the parse content option of the SSX, and it should all work fine :) Cheers, Jerome Dilipkumar Jadhav wrote:
Hello friends, I am trying to use the work of Mark Strauss (mktree) found at http://www.javascripttoolbox.com/lib/mktree/ in xwiki application/plugin that allows creation of collapsible tree from a static ul and lit list. So far, I had it working through by adding the javascript and the css file by adding the actual path of these files in the "presentation" section of the admin dashboard. However, I wanted it to be more organized and make it available on demand. So i created the jsx and the ssx files in place of the javascript and the css files. So far so good. However, there are images that were referred by the css file which worked fine in the previous setup (basically they assign a plus and minus sign on the right of the ul and li elements). Now, I've attached these image files to the ssx. But I am not able to get the ssx to work with the images. The Javascript works fine from the jsx. The tree does collapse and expand as expected. However, the images from the style sheet does not show up. I've used the following line in the "object" edit mode of the ssx page:
ul.mktree li.liOpen .bullet { cursor: pointer; background: url($xwiki.getAttachmentURL("minus.gif")) center left no-repeat; }
...here minus.gif is attached to the ssx page. But no go. I did go through the various resources on skin customizations and the addsizes extension tutorial. I could not understand the "use velocity to attach images" technique in the addsizes tutorial. Is there a simpler way to make the ssx pick up the image files and behave just like a normal css file?... Any help would be appreciated. Thank you all. _______________________________________________ users mailing list [email protected] http://lists.xwiki.org/mailman/listinfo/users
Dilipkumar Jadhav wrote:
Hello friends, I am trying to use the work of Mark Strauss (mktree) found at http://www.javascripttoolbox.com/lib/mktree/ in xwiki application/plugin
Forgot to say BTW, this is cool :) You should publish it on code.xwiki.org once it's finished, I'm sure it can come handy to other application developers. Jerome.
that allows creation of collapsible tree from a static ul and lit list. So far, I had it working through by adding the javascript and the css file by adding the actual path of these files in the "presentation" section of the admin dashboard. However, I wanted it to be more organized and make it available on demand. So i created the jsx and the ssx files in place of the javascript and the css files. So far so good. However, there are images that were referred by the css file which worked fine in the previous setup (basically they assign a plus and minus sign on the right of the ul and li elements). Now, I've attached these image files to the ssx. But I am not able to get the ssx to work with the images. The Javascript works fine from the jsx. The tree does collapse and expand as expected. However, the images from the style sheet does not show up. I've used the following line in the "object" edit mode of the ssx page:
ul.mktree li.liOpen .bullet { cursor: pointer; background: url($xwiki.getAttachmentURL("minus.gif")) center left no-repeat; }
...here minus.gif is attached to the ssx page. But no go. I did go through the various resources on skin customizations and the addsizes extension tutorial. I could not understand the "use velocity to attach images" technique in the addsizes tutorial. Is there a simpler way to make the ssx pick up the image files and behave just like a normal css file?... Any help would be appreciated. Thank you all. _______________________________________________ users mailing list [email protected] http://lists.xwiki.org/mailman/listinfo/users
participants (2)
-
Dilipkumar Jadhav -
Jerome Velociter