HoshinoKoji/jsPsych
1
0
Fork 0
mirror of https://github.com/jspsych/jsPsych.git synced 2025-05-10 11:10:54 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

tweak example HTML file classes and add note about inheritance #832

Browse Source
This commit is contained in:
Becky Gilbert 2021-01-12 14:07:24 -08:00
parent 29d5aaa1c4
commit 761491ed94
2 changed files with 12 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
docs/plugins/overview.md
View File

@ -46,7 +46,7 @@ on_finish | function | `function(){ return; }` | A callback function to execute
on_start | function | `function(){ return; }` | A callback function to execute when the trial begins, before any loading has occurred. See [this page](../overview/callbacks.md) for more details.
on_load | function | `function(){ return; }` | A callback function to execute when the trial has loaded, which typically happens after the initial display of the plugin has loaded. See [this page](../overview/callbacks.md) for more details.
data | object | *undefined* | An object containing additional data to store for the trial. See [this page](../overview/data.md) for more details.
css_classes | string | null | A list of CSS classes to add to the jsPsych display element for the duration of this trial. This allows you to create custom formatting rules that are only applied to specific trials. See jsPsych/examples/css-classes-parameter.html for examples.
css_classes | string | null | A list of CSS classes to add to the jsPsych display element for the duration of this trial. This allows you to create custom formatting rules (CSS classes) that are only applied to specific trials. See jsPsych/examples/css-classes-parameter.html for examples.
## Data collected by plugins

11
examples/css-classes-parameter.html
View File

@ -7,6 +7,16 @@
<script src="../plugins/jspsych-html-keyboard-response.js"></script>
<link rel="stylesheet" href="../css/jspsych.css">
<style>
/*
Note that these CSS classes will only be added to the jspsych-content div.
In order for the CSS rules to be applied to the elements inside this div (stimulus, prompt, etc.),
the CSS properties will need to be inherited. Not all CSS properties are inherited from
parent elements, so this will limit what CSS properties you can change using the css_class parameter.
To learn more about CSS inheritance, see:
https://developer.mozilla.org/en-US/docs/Web/CSS/inheritance
https://developer.mozilla.org/en-US/docs/Learn/CSS/Building_blocks/Cascade_and_inheritance#inheritance
https://stackoverflow.com/questions/5612302/which-css-properties-are-inherited
*/
.condition1 {
color: red;
font: small-caps bold 30px/30px Arial, sans-serif;
@ -17,6 +27,7 @@
font-size: 40px;
text-decoration: underline wavy blue;
line-height: 200%;
background-color: aqua;
}
</style>
</head>