Description Maker
/* HIDE RADIO */
{
position: absolute;
opacity: 0;
width: 0;
height: 0;
}
/* IMAGE STYLES */
+ img {
cursor: pointer;
width:150px;
height:150px;
margin-left:10px;
}
/* CHECKED STYLES */
:checked + img {
outline: 4px solid #46e946;;
}
p{
display: inline-block;
margin: 0;
}
#d1,#d3,#d4,#d5,#d6,#d7,#d8,#d9,#d10,#d11,#d12,#d13,#d14,#d15
,#d16,#d17,#d18,#d19,#d20,#d21,#d22,#d23,#d24,#d25 ,#d26,#d27,#d28,#d29,#d30,#d31,#d32,#d33,#d34,#d35 {
display:none;
}
h5 {
font-size:20px;
}
.png)
.png)
Next 3 function hideDiv2() { document.getElementById("d2").style.display = "none"; document.getElementById("d1").style.display = "block"; }
.png)
.png)
.png)
Next 2 function hideDiv1() { document.getElementById("d1").style.display = "none"; document.getElementById("d3").style.display = "block"; }
.png)
.png)
.png)
.png)
.png)
Next 4 function hideDiv3() { document.getElementById("d3").style.display = "none"; document.getElementById("d4").style.display = "block"; }
.png)
.png)
.png)
Next 5 function hideDiv4() { document.getElementById("d4").style.display = "none"; document.getElementById("d5").style.display = "block"; }
.png)
.png)
Next 6 function hideDiv5() { document.getElementById("d5").style.display = "none"; document.getElementById("d6").style.display = "block"; }
.png)
.png)
Next 7 function hideDiv6() { document.getElementById("d6").style.display = "none"; document.getElementById("d7").style.display = "block"; }
.png)
.png)
Next 8 function hideDiv7() { document.getElementById("d7").style.display = "none"; document.getElementById("d8").style.display = "block"; }
.png)
.png)
.png)
.png)
Next 9 function hideDiv8() { document.getElementById("d8").style.display = "none"; document.getElementById("d9").style.display = "block"; }
.png)
.png)
.png)
.png)
Next 10 function hideDiv9() { document.getElementById("d9").style.display = "none"; document.getElementById("d10").style.display = "block"; }
.png)
.png)
.png)
Next 11 function hideDiv10() { document.getElementById("d10").style.display = "none"; document.getElementById("d11").style.display = "block"; }
.png)
.png)
.png)
.png)
.png)
Next 12 function hideDiv11() { document.getElementById("d11").style.display = "none"; document.getElementById("d12").style.display = "block"; }
.png)
.png)
.png)
.png)
Next 13 function hideDiv12() { document.getElementById("d12").style.display = "none"; document.getElementById("d13").style.display = "block"; }
.png)
.png)
Next 14 function hideDiv13() { document.getElementById("d13").style.display = "none"; document.getElementById("d14").style.display = "block"; }
.png)
.png)
Next 15 function hideDiv14() { document.getElementById("d14").style.display = "none"; document.getElementById("d15").style.display = "block"; }
.png)
.png)
.png)
.png)
.png)
.png)
.png)
Next 16 function hideDiv15() { document.getElementById("d15").style.display = "none"; document.getElementById("d16").style.display = "block"; }
.png)
.png)
.png)
Next 17 function hideDiv16() { document.getElementById("d16").style.display = "none"; document.getElementById("d17").style.display = "block"; }
.png)
.png)
Next 18 function hideDiv17() { document.getElementById("d17").style.display = "none"; document.getElementById("d18").style.display = "block"; }
Next 19 function hideDiv18() { document.getElementById("d18").style.display = "none"; document.getElementById("d19").style.display = "block"; }
.png)
.png)
.png)
Next 20 function hideDiv19() { document.getElementById("d19").style.display = "none"; document.getElementById("d20").style.display = "block"; }
.png)
.png)
.png)
.png)
Next 21 function hideDiv20() { document.getElementById("d20").style.display = "none"; document.getElementById("d21").style.display = "block"; }
.png)
.png)
.png)
.png)
.png)
.png)
Next 22 function hideDiv21() { document.getElementById("d21").style.display = "none"; document.getElementById("d22").style.display = "block"; }
.png)
.png)
.png)
.png)
.png)
.png)
.png)
.png)
.png)
.png)
.png)
Next 23 function hideDiv22() { document.getElementById("d22").style.display = "none"; document.getElementById("d23").style.display = "block"; }
.png)
.png)
.png)
.png)
.png)
.png)
.png)
.png)
.png)
.png)
.png)
.png)
.png)
.png)
.png)
.png)
.png)
.png)
.png)
.png)
.png)
.png)
Next 24 function hideDiv23() { document.getElementById("d23").style.display = "none"; document.getElementById("d24").style.display = "block"; }
Next 25 function hideDiv24() { document.getElementById("d24").style.display = "none"; document.getElementById("d25").style.display = "block"; }
Next 26 function hideDiv25() { document.getElementById("d25").style.display = "none"; document.getElementById("d26").style.display = "block"; }
Next 27 function hideDiv26() { document.getElementById("d26").style.display = "none"; document.getElementById("d27").style.display = "block"; }
Next 28 function hideDiv27() { document.getElementById("d27").style.display = "none"; document.getElementById("d28").style.display = "block"; }
Next 29 function hideDiv28() { document.getElementById("d28").style.display = "none"; document.getElementById("d29").style.display = "block"; }
Submit
function showBox() {
document.getElementById("form").style.display = "none";
document.getElementById("btn1").style.display = "none";
document.getElementById("desc").style.display = "block";
}
Choose a PLANT HABIT.
Next 3 function hideDiv2() { document.getElementById("d2").style.display = "none"; document.getElementById("d1").style.display = "block"; }
Choose an option.
Next 2 function hideDiv1() { document.getElementById("d1").style.display = "none"; document.getElementById("d3").style.display = "block"; }
Choose PLANT BEHAVIOUR.
Next 4 function hideDiv3() { document.getElementById("d3").style.display = "none"; document.getElementById("d4").style.display = "block"; }
Choose PLANT HABITAT.
Next 5 function hideDiv4() { document.getElementById("d4").style.display = "none"; document.getElementById("d5").style.display = "block"; }
Choose an option.
Next 6 function hideDiv5() { document.getElementById("d5").style.display = "none"; document.getElementById("d6").style.display = "block"; }
Choose an option.
Next 7 function hideDiv6() { document.getElementById("d6").style.display = "none"; document.getElementById("d7").style.display = "block"; }
Choose a TYPE OF ROOT SYSTEM.
Next 8 function hideDiv7() { document.getElementById("d7").style.display = "none"; document.getElementById("d8").style.display = "block"; }
Choose ANY ROOT MODIFICATION (IF ANY).
Next 9 function hideDiv8() { document.getElementById("d8").style.display = "none"; document.getElementById("d9").style.display = "block"; }
Choose a BRANCHIN PATTERN IN STEM.
Next 10 function hideDiv9() { document.getElementById("d9").style.display = "none"; document.getElementById("d10").style.display = "block"; }
Choose STEM SURFACE.
Next 11 function hideDiv10() { document.getElementById("d10").style.display = "none"; document.getElementById("d11").style.display = "block"; }
Choose STEM COLOUR.
Next 12 function hideDiv11() { document.getElementById("d11").style.display = "none"; document.getElementById("d12").style.display = "block"; }
Choose STEM SHAPE.
Next 13 function hideDiv12() { document.getElementById("d12").style.display = "none"; document.getElementById("d13").style.display = "block"; }
Choose an option.
Next 14 function hideDiv13() { document.getElementById("d13").style.display = "none"; document.getElementById("d14").style.display = "block"; }
Choose an option.
Next 15 function hideDiv14() { document.getElementById("d14").style.display = "none"; document.getElementById("d15").style.display = "block"; }
Choose STEM MODIFICATION (IF ANY).
Next 16 function hideDiv15() { document.getElementById("d15").style.display = "none"; document.getElementById("d16").style.display = "block"; }
Choose LEAVES NATURE.
Next 17 function hideDiv16() { document.getElementById("d16").style.display = "none"; document.getElementById("d17").style.display = "block"; }
Choose an option.
Next 18 function hideDiv17() { document.getElementById("d17").style.display = "none"; document.getElementById("d18").style.display = "block"; }
Choose an option.
Next 19 function hideDiv18() { document.getElementById("d18").style.display = "none"; document.getElementById("d19").style.display = "block"; }
Choose an option.
Next 20 function hideDiv19() { document.getElementById("d19").style.display = "none"; document.getElementById("d20").style.display = "block"; }
Choose PHYLLOTAXY.
Next 21 function hideDiv20() { document.getElementById("d20").style.display = "none"; document.getElementById("d21").style.display = "block"; }
Choose LEAF VENATION.
Next 22 function hideDiv21() { document.getElementById("d21").style.display = "none"; document.getElementById("d22").style.display = "block"; }
Choose LEAF TYPE.
Next 23 function hideDiv22() { document.getElementById("d22").style.display = "none"; document.getElementById("d23").style.display = "block"; }
Choose a Leaf shape/leaflet shape.
Next 24 function hideDiv23() { document.getElementById("d23").style.display = "none"; document.getElementById("d24").style.display = "block"; }
Choose a Leaf APEX.
Next 25 function hideDiv24() { document.getElementById("d24").style.display = "none"; document.getElementById("d25").style.display = "block"; }
Choose a Leaf BASE.
Next 26 function hideDiv25() { document.getElementById("d25").style.display = "none"; document.getElementById("d26").style.display = "block"; }
Choose a Leaf MARGIN.
Next 27 function hideDiv26() { document.getElementById("d26").style.display = "none"; document.getElementById("d27").style.display = "block"; }
Choose a Leaf SURFACE.
Next 28 function hideDiv27() { document.getElementById("d27").style.display = "none"; document.getElementById("d28").style.display = "block"; }
Choose a Leaf MODIFICATION.(IF ANY).
Next 29 function hideDiv28() { document.getElementById("d28").style.display = "none"; document.getElementById("d29").style.display = "block"; }
Edit again
function showBox2() {
document.getElementById("form").style.display = "block";
document.getElementById("btn1").style.display = "block";
document.getElementById("desc").style.display = "none";
}
function displayRadioValue1() {
var habit1 = document.getElementsByName('habit1');
for(i = 0; i < habit1.length; i++) {
if(habit1.checked)
document.getElementById("r1").innerHTML
= ""+habit1.value;
}
}
function displayRadioValue2() {
var habit2 = document.getElementsByName('habit2');
for(i = 0; i < habit2.length; i++) {
if(habit2.checked)
document.getElementById("r2").innerHTML
= ""+habit2.value;
}
}
function displayRadioValue3() {
var habit3 = document.getElementsByName('habit3');
for(i = 0; i < habit3.length; i++) {
if(habit3.checked)
document.getElementById("r3").innerHTML
= ""+habit3.value;
}
}
function displayRadioValue4() {
var habit4 = document.getElementsByName('habit4');
for(i = 0; i < habit4.length; i++) {
if(habit4.checked)
document.getElementById("r4").innerHTML
= ""+habit4.value;
}
}
function displayRadioValue5() {
var habit5 = document.getElementsByName('habit5');
for(i = 0; i < habit5.length; i++) {
if(habit5.checked)
document.getElementById("r5").innerHTML
= ""+habit5.value;
}
}
function displayRadioValue6() {
var habit6 = document.getElementsByName('habit6');
for(i = 0; i < habit6.length; i++) {
if(habit6.checked)
document.getElementById("r6").innerHTML
= ""+habit6.value;
}
}
function displayRadioValue7() {
var root1 = document.getElementsByName('root1');
for(i = 0; i < root1.length; i++) {
if(root1.checked)
document.getElementById("r7").innerHTML
= ""+root1.value;
}
}
function displayRadioValue8() {
var root2 = document.getElementsByName('root2');
for(i = 0; i < root2.length; i++) {
if(root2.checked)
document.getElementById("r8").innerHTML
= ""+root2.value;
}
}
function displayRadioValue9() {
var stem1 = document.getElementsByName('stem1');
for(i = 0; i < stem1.length; i++) {
if(stem1.checked)
document.getElementById("r9").innerHTML
= ""+stem1.value;
}
}
function displayRadioValue10() {
var stem2 = document.getElementsByName('stem2');
for(i = 0; i < stem2.length; i++) {
if(stem2.checked)
document.getElementById("r10").innerHTML
= ""+stem2.value;
}
}
function displayRadioValue11() {
var stem3 = document.getElementsByName('stem3');
for(i = 0; i < stem3.length; i++) {
if(stem3.checked)
document.getElementById("r11").innerHTML
= ""+stem3.value;
}
}
function displayRadioValue12() {
var stem4 = document.getElementsByName('stem4');
for(i = 0; i < stem4.length; i++) {
if(stem4.checked)
document.getElementById("r12").innerHTML
= ""+stem4.value;
}
}
function displayRadioValue13() {
var stem5 = document.getElementsByName('stem5');
for(i = 0; i < stem5.length; i++) {
if(stem5.checked)
document.getElementById("r13").innerHTML
= ""+stem5.value;
}
}
function displayRadioValue14() {
var stem6 = document.getElementsByName('stem6');
for(i = 0; i < stem6.length; i++) {
if(stem6.checked)
document.getElementById("r14").innerHTML
= ""+stem6.value;
}
}
function displayRadioValue15() {
var stem7 = document.getElementsByName('stem7');
for(i = 0; i < stem7.length; i++) {
if(stem7.checked)
document.getElementById("r15").innerHTML
= ""+stem7.value;
}
}
function displayRadioValue16() {
var leaf1 = document.getElementsByName('leaf1');
for(i = 0; i < leaf1.length; i++) {
if(leaf1.checked)
document.getElementById("r16").innerHTML
= ""+leaf1.value;
}
}
function displayRadioValue17() {
var leaf2 = document.getElementsByName('leaf2');
for(i = 0; i < leaf2.length; i++) {
if(leaf2.checked)
document.getElementById("r17").innerHTML
= ""+leaf2.value;
}
}
function displayRadioValue18() {
var leaf3 = document.getElementsByName('leaf3');
for(i = 0; i < leaf3.length; i++) {
if(leaf3.checked)
document.getElementById("r18").innerHTML
= ""+leaf3.value;
}
}
function displayRadioValue19() {
var leaf4 = document.getElementsByName('leaf4');
for(i = 0; i < leaf4.length; i++) {
if(leaf4.checked)
document.getElementById("r19").innerHTML
= ""+leaf4.value;
}
}
function displayRadioValue20() {
var leaf5 = document.getElementsByName('leaf5');
for(i = 0; i < leaf5.length; i++) {
if(leaf5.checked)
document.getElementById("r20").innerHTML
= ""+leaf5.value;
}
}
function displayRadioValue21() {
var leaf6 = document.getElementsByName('leaf6');
for(i = 0; i < leaf6.length; i++) {
if(leaf6.checked)
document.getElementById("r21").innerHTML
= ""+leaf6.value;
}
}
function displayRadioValue22() {
var leaf7 = document.getElementsByName('leaf7');
for(i = 0; i < leaf7.length; i++) {
if(leaf7.checked)
document.getElementById("r22").innerHTML
= ""+leaf7.value;
}
}
function displayRadioValue23() {
var leaf8 = document.getElementsByName('leaf8');
for(i = 0; i < leaf8.length; i++) {
if(leaf8.checked)
document.getElementById("r23").innerHTML
= ""+leaf8.value;
}
}
function displayRadioValue24() {
var leaf9 = document.getElementsByName('leaf9');
for(i = 0; i < leaf9.length; i++) {
if(leaf9.checked)
document.getElementById("r24").innerHTML
= ""+leaf9.value;
}
}
function displayRadioValue25() {
var leaf10 = document.getElementsByName('leaf10');
for(i = 0; i < leaf10.length; i++) {
if(leaf10.checked)
document.getElementById("r25").innerHTML
= ""+leaf10.value;
}
}
function displayRadioValue26() {
var leaf11 = document.getElementsByName('leaf11');
for(i = 0; i < leaf11.length; i++) {
if(leaf11.checked)
document.getElementById("r26").innerHTML
= ""+leaf11.value;
}
}
function displayRadioValue27() {
var leaf12 = document.getElementsByName('leaf12');
for(i = 0; i < leaf12.length; i++) {
if(leaf12.checked)
document.getElementById("r27").innerHTML
= ""+leaf12.value;
}
}
function displayRadioValue28() {
var leaf13 = document.getElementsByName('leaf13');
for(i = 0; i < leaf13.length; i++) {
if(leaf13.checked)
document.getElementById("r28").innerHTML
= ""+leaf13.value;
}
}Plant Description is here !
Habitat:
, , , ,Root:
,Stem:
, , , , , ,Leaf:
, , , , , , , , , , , ,Inflorescence:
................
flower:
,
,
,
,
,
,
,
,
,
, ................