Hi Walter I’ve used your accordion with arrows example and code to create my own and all working great but I wanted to ask how I would use a custom image in place of the unicode arrows?
That’s relatively easy. Generated content can just be empty boxes – you can set the content attribute to ‘’ (two single-quotes) and that gives you no text content. Then give the box some shape with width and height, and finally, set a background image on it. That will get you exactly what you want. If you use the background-size attribute, then you can make your images double-size, and shrink them to fit, resulting in “Retina” resolution, so it looks as sharp as the Unicode trick.
On Mar 11, 2016, at 4:43 AM, Dave Dunning email@hidden wrote:
Hi Walter I’ve used your accordion with arrows example and code to create my own and all working great but I wanted to ask how I would use a custom image in place of the unicode arrows?
That’s relatively easy. Generated content can just be empty boxes – you can set the content attribute to ‘’ (two single-quotes) and that gives you no text content. Then give the box some shape with width and height, and finally, set a background image on it. That will get you exactly what you want. If you use the background-size attribute, then you can make your images double-size, and shrink them to fit, resulting in “Retina” resolution, so it looks as sharp as the Unicode trick.