To divide the string parts for styling, simply declare them with <></> tags. To set the id of the tag, write #{id} within the first tag.
To add images, simply write <img src="src-to-image" />
.
You can also add id's to images, simply add a #{id} anywhere within the img-tag
The object sets the styling of the declared tags within the string. Use CSS in JS to declare properties and values.
fancylog('<#id1>Hello, i'm blue dabedeedabeda!</> I have no styling, <#id2>but i am underlined!</> <img src="/myimage.png" #image/>',
{
id1: {
color: 'blue',
fontWeight: 'bold',
fontSize: '2rem'
},
id2: { textDecoration: 'underline' },
image: {
width: '300px',
height: '200px'
}
});
- Nested tags