Adding css styles to a javascript page.

[francdore]

Hi there,

I'm trying to add styles to a javascript page.

What am I doing wrong?

Here is my styles I'm trying to add:

_getTemplate : function (parameters) {
         return "" +
		 	   "<styles>\n" +
			   ".bookmark-image: {position: absolute;}\n" +
			   ".bookmark-image:hover: {background: url(images/bookmark-image-le-good-life.png); no-repeat; width: 169px; height: 41px; position: absolute;}\n" +
			   "</styles>\n" +

And when I view it on the site it look like this:

<styles>
.bookmark-image: 
.bookmark-image:hover: 
</styles>

While it should be looking like this:

<styles>
.bookmark-image: {position: absolute;}
.bookmark-image:hover {background: url(images/bookmark-image-le-good-life.png); no-repeat; width: 169px; height: 41px; position: absolute;} 
</styles>

Thank you in advance.

 

[ITCynic]

Looks to me like the curly brackets { } that is being used in-line are the problem.

 

[Tachyon]

I don't know javascript syntax very well but the previous poster may be right in that you need the correct syntax for the curly brackets {}. Also why do you have a colon between your classes and the curly brackets

.bookmark-image: {
.bookmark-image:hover: {

should be

.bookmark-image {
.bookmark-image:hover {

 

[guest2013-1]

Why include styles like that in the first place?

 

[murraybiscuit]

Why include styles like that in the first place?

I agree, it's odd. Perhaps it's part of a templating language which is attempting to replace tokens within braces?

 

[guest2013-1]

I agree, it's odd. Perhaps it's part of a templating language which is attempting to replace tokens within braces?

Then the guy's responsible for the template's needs to be shot...

 

[Barry Crous]

Why don't you load an external css file with javascript:

<script type="text/javascript">
document.write('<link rel="stylesheet" type="text/css" href="/css/styles.css">');
</script>

Cheers

 

[FarligOpptreden]

Why don't you load an external css file with javascript:

<script type="text/javascript">
document.write('<link rel="stylesheet" type="text/css" href="/css/styles.css">');
</script>

Cheers

Agreed. Would be a much cleaner / easier maintainable solution.

 

[guest2013-1]

Or... here's a wild idea, just include the damn thing where it's supposed to be and stop ****ing around with trying to do dynamic **** where you don't need it?