harunB10 harunB10 - 4 years ago 124
CSS Question

Change div width in Laravel blade using expression or jQuery

I want to dynamically change width value of div element. Div contains blocks and the size of them depends on variable. For example if

$t->spotdiff = 2
I'd have two blocks separated equally 50/50% in column, if
$t->spotdiff = 10
, then I'd have 10 smaller blocks and so on...

This is my blade:

@foreach($test as $t)
@for($i = 0; $ i < $t->spotdiff; $i++)
<div id="modal" data-toggle="modal" data-target="#myModal" style="cursor:pointer;float:left;background:#c0c0c0;height:18px;margin-right:1px;"></div>@endfor<span style="color:#fd8809">{{$t->spotdiff}}

I was trying to set it using Blade (I'm not actually sure if expressions could be written like this):

<div id="modal" style="witdh: {{(100 / $t->spotdiff)}}"></div>

Or with jQuery:

<script type="text/javascript">
$("#modal").css("width", "{{(100 / $t->spotdiff)}}");

But without success. Any ideas?

Answer Source

You have spelling mistake,

1) Direct way

<div id="modal" style="width: {{(100 / $t->spotdiff)}}px"></div>


<script type="text/javascript">
    $("#modal").css("width", "{{(100 / $t->spotdiff)}}px");

Give it a try, it will work.

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download