railsr railsr - 4 months ago 10
HTML Question

Change column width depending on the selectedvalue

I'm using twitter bootstrap and have the following structure somewhere in my code:

.row
.col-md-6
content1
.col-md-3
content2
.col-md-1#id_selector
content3
.col-md-2
content4


I also have a js script that shows/hides the column with
#id_selector
depending on a select value from one of the select fields.

What I want to achive is to change the
.col-md-3
to
col-md-4
when
.col-md-1#id_selector
is hidden
and set it back to 3 when it's shown

How can I do that?

Thanks

Answer

You'll need javascript for this:

document.getElementById('myButton').onclick = function() {
  document.getElementById('column-to-change').className.replace('col-md-3', 'col-md-4');
}

Note: With no code provided in the OP, I'm simply providing the basic outline using onclick. If you can post some code, it will be easier to troubleshoot.

Comments