Presenting descriptive text in a functional and aesthetically pleasing way is a critical and fundamental need for many websites. I feel this extension would be a well received addition to Web Builder capability.
Please implement this responsive accordion text widget as a WB Extension. Doing this myself would require a significant learning curve. However I would be happy to assist in dissecting this widget to determine configuration components and unnecessary code elements.
Unsatisfied with the functionality, capability and/or presentation of available accordion text elements, I hunted for and tested text accordions to find ideal functionality and aesthetic presentation.
Main Requirements:
- Responsive and mobile friendly
Accordion starts with all sections closed
Section height determined by content of each section (height of sections not same)
Only one section is open at a time (other section automatically closes)
The text accordion widget I found is extremely good, completely free and open source, with no usage restrictions. The only requirement is that the license details be included in use and distribution. I requested the developer make a modification to the text accordion that enables it to be initially presented with all sections closed to improve presentation. This modification has been implemented.
Among
http://rodrigoludgero.com/rlaccordion/rlaccordion.html the example "Mix Settings" has the most useful behavior, with my modification included, shown below labeled "Corrected code:" (my modification includes both a correction and setting change)
https://github.com/Rodrigo-Ludgero/rlaccordion
https://plugins.jquery.com/rlAccordion
http://rodrigoludgero.com/rlaccordion/rlaccordion.html
- Example labeled "Mix Settings" is the preferred behavior, with minor modifications (below).
There is a minor (and easily fixed) error in the current implementation, introduced when recently enhanced. Below is my code correction, which has been submitted to the developer to be implemented in the original:
In 'js' folder, the file 'scripts.js' contains the following code:
Code containing error:
$("#thirth").rlAccordion('mix', {
childNum: 4
});
Corrected code:
$("#thirth").rlAccordion('mix', {
childNumOptions: false
});
"childNum:" must be changed to "childNumOptions:" to function correctly.
"#thirth" should be spelled "#third", though functions correctly as the referencing element in rlaccordion.html is same.
