css()

Gets the value of a style property for the first element in the set of HTML elements that match the selector of the script or of another query in the template (see query()), or sets one or more CSS properties for every element in the set.

css(styleNam​e) : String

Returns the value of the specified CSS property.

propertyName

String; the name of the CSS property.

Examples

This script stores the text color of the results (the HTML elements that match the selector of the script) in a variable.

​var textcolor = results.css("color");​

​

The following script looks up an element with the ID #calloutbox and stores its background color in a variable.

var backgroundcolor = query("#calloutbox").css("background-color");

css(styleName, valu​e)

Function to set a CSS property.

propertyName

String; the name of the CSS property.

value

String; value for the CSS property or a map of property-value pairs to set.

Examples

This script looks up an element with the ID #calloutbox and sets its text color to red.

query("#callout p").css('color' , 'red');

The following script does the same, but it only sets the text color to red if in the current record the value of the field 'accounttype' is 'PRO'.

if(record.fields.accounttype == "PRO") { 
query("#callout p").css("color","red"); 
}

This script sets the text color of the results to a hexadecimal color code.

results.css('color' , '#669900');

This script loads a snippet into a variable. Then it finds/replaces text in the snippet and applies a css property to the replacing text.

​var mysnippet = loadhtml('snippets/snippet vars.html'); 
mysnippet.find('@var@').text('OL Connect').css('text-decoration','underline'); 
results.replaceWith(mysnippet);

css(properties)

Function to set one or multiple CSS properties.

properties

Array; map of property-value pairs to set.

Examples

This script colors the text of the results (the set of HTML elements that match the selector of the script) red and makes it bold.

​​results.css({'color' : 'red', 'font-weight' : 'bold'});

• Last Topic Update: 22, December, 2016 10:34 AM
• Last Published: 23, May, 2019 01:55 PM