Style/End Style: Difference between revisions

From NSB App Studio
Jump to navigation Jump to search
(Created page with "Style <br /> :::[''statements''] <br /> End Style == Description == The Style statement allows you to embed pure css style rules in your app. This allows you to have additi...")
 
 
(21 intermediate revisions by the same user not shown)
Line 1: Line 1:
{{Deprecated|newvarlink=Project CSS|newvarname=Project CSS}}
Style <br />
Style <br />
:::[''statements''] <br />
:::[''statements''] <br />
Line 5: Line 6:
== Description ==
== Description ==


The Style statement allows you to embed pure css style rules in your app. This allows you to have additional functionality to your app. Statements within this block must follow all css rules. They are ignored by AppStudio itself. For more information, see the Tech Note ‘The role of JavaScript, HTML5 and WebKit’.
'''This statement is deprecated in AppStudio 5. Instead, put your styling rules into Open Project CSS in the Run menu.


Style rules are automatically global and loaded at startup. They are not executed as part of the flow of control of your app. To change the style of a control at runtime, use
The Style statement allows you to embed pure css style rules in your app. This allows you to have additional functionality to your app. Statements within this block must follow all css rules. They are ignored by AppStudio itself. For more information, see the Tech Note ‘[[The role of JavaScript, HTML5 and WebKit]]’.
 
Style rules are automatically global and loaded at startup. They are not executed as part of the flow of control of your app. Do not put a style block inside a [[Sub]] or [[Function]].
 
To change the style of a control at runtime, use
<pre>
<pre>
   myControl.style.backround = "red'
   myControl.style.backround = "red'
Line 15: Line 20:
</pre>
</pre>


== Example (Basic) ==
== Example ==


<pre>
<tabber>
'This sample shows how to change the appearance of a button at runtime.
  JavaScript=
   
<syntaxhighlight lang="JavaScript">
Style
  #Button1 {background: red}
End Style
 
</pre>
 
== Example (JavaScript) ==
<pre>
// This sample shows how to add a button at runtime.
// This sample shows how to add a button at runtime.
   
   
Line 33: Line 30:
   #Button1 {background: red}
   #Button1 {background: red}
</style><script>
</style><script>
</pre>
</syntaxhighlight>
|-|
BASIC=
<syntaxhighlight lang="vb.net">
'This sample shows how to change the appearance of a button in your code.
Style
  #Button1 {background: red}
End Style
</syntaxhighlight>
</tabber>


== Output ==
== Output ==
Line 42: Line 49:


== Related Items ==
== Related Items ==
[[Project CSS]]


[//en.wikipedia.org/wiki/JavaScript JavaScript]
[//en.wikipedia.org/wiki/JavaScript JavaScript]

Latest revision as of 23:29, 24 July 2019

This deprecated feature should no longer be used, but is still available for reasons of backwards compatibility.

Please see Project CSS for an alternative way to use this feature.

Style

[statements]

End Style

Description

This statement is deprecated in AppStudio 5. Instead, put your styling rules into Open Project CSS in the Run menu.

The Style statement allows you to embed pure css style rules in your app. This allows you to have additional functionality to your app. Statements within this block must follow all css rules. They are ignored by AppStudio itself. For more information, see the Tech Note ‘The role of JavaScript, HTML5 and WebKit’.

Style rules are automatically global and loaded at startup. They are not executed as part of the flow of control of your app. Do not put a style block inside a Sub or Function.

To change the style of a control at runtime, use

  myControl.style.backround = "red'
 
  'or
  $(myControl).css("background", "red")

Example

// This sample shows how to add a button at runtime.
 
</script><style>
  #Button1 {background: red}
</style><script>

'This sample shows how to change the appearance of a button in your code.
 
Style 
  #Button1 {background: red}
End Style

Output

(a button and a box are displayed. Click the button and text is put in the box)

Related Items

Project CSS

JavaScript