0
Welcome Guest! Login
0 items Join Now

Help with div/module class

  • Help with div/module class

    Posted 11 years 5 months ago
    • Hi guys!

      I do not know how to write down this question so I hope you will understand it anyway. I am using the Ximenia template in JOOMLA! I have the roksprocket module set to features and positioned in the showcase area. In the next picture you will be able to see what I was thinking of:

      This image is hidden for guests.
      Please log in or register to see it.


      The red circles should be working like small tooltip icons - placed over the image (as you can see). Now I was thinking if this is possible to make using some div classes. For example: I would create 4 different modules with the same tooltip icon - and then I would create a tooltip for each icon. Now I was wondering if I create a unique class in css (to set the margins and positions) and use that for the module will I be able to achieve this?

      Thank you!
    • Tilen
    • MrT's Avatar
    • MrT
    • Preeminent Rocketeer
    • Posts: 101084
    • Thanks: 13484
    • Web Designer/Developer

    Re: Help with div/module class

    Posted 11 years 5 months ago
    • no you need to use an image map for that...

      http://www.w3schools.com/tags/tag_map.asp

      Regards, Mark.
    • Please search forums before posting. Please make sure your post includes the version of the CMS you are using and a link to the problem. Annotations on screenshots can also be helpful to explain problems/goals. Please use the "secure" tab for confidential information.
  • Re: Help with div/module class

    Posted 11 years 5 months ago
    • And how to put this into the roksproket features image?
    • Tilen
    • MrT's Avatar
    • MrT
    • Preeminent Rocketeer
    • Posts: 101084
    • Thanks: 13484
    • Web Designer/Developer

    Re: Help with div/module class

    Posted 11 years 5 months ago
    • This is considered as a big customization request which falls way beyond the scope of this free support forum. You can always try to post your request in our The Marketplace forum and get (paid) support from someone that is willing to do this.

      But basically, you'll need to take one of two approaches...

      1. change the roksprocket html item override to add the usemap attribute, then add the map html in the article description and ensure stripHTML tags is set to NO in the roksprocket

      or

      2. embed both you image and map html in the description field, ensure stripHTML is set to NO in the roksprocket and do not use image field in roksprocket. Some CSS modifications will also need to be made as well using custom CSS

      In both approaches I am not sure how well this is going to work in a responsive template (where the image dimensions change in differing viewport sizes) - so it will require a lot of testing.

      Regards, Mark.
    • Please search forums before posting. Please make sure your post includes the version of the CMS you are using and a link to the problem. Annotations on screenshots can also be helpful to explain problems/goals. Please use the "secure" tab for confidential information.

Time to create page: 0.086 seconds