Edit in JSFiddle

$(function() {
    
    $('#click-close').click(function(evt){
        evt.preventDefault();
        $('#event-modal').modal({
            backdrop: true
        });
        
    });

    $('#click-do-not-close').click(function(evt){
        evt.preventDefault();        
        $('#event-modal2').modal({
            backdrop: 'static'
        });
        
    });  

});

<div id="event-modal" class="modal hide fade">
    <div class="modal-header">
        <a class="close" href="#" data-dismiss="modal">x</a>
        <h3>Modal Heading</h3>
    </div>
    <div class="modal-body">
        <p>Some information</p>
    </div>
    <div class="modal-footer">
        <a class="btn primary" href="#" data-dismiss="modal">Primary</a>
        <a class="btn secondary" href="#" data-dismiss="modal">Secondary</a>
    </div>
</div>
<div id="event-modal2" class="modal hide fade">
    <div class="modal-header">
        <a class="close" href="#" data-dismiss="modal">x</a>
        <h3>Modal Heading</h3>
    </div>
    <div class="modal-body">
        <p>Some information</p>
    </div>
    <div class="modal-footer">
        <a class="btn primary" href="#" data-dismiss="modal">Primary</a>
        <a class="btn secondary" href="#" data-dismiss="modal">Secondary</a>
    </div>
</div>
<p>
<a href="#" id="click-close">When you click on background - modal will close</a>
</p>
<p>
<a href="#" id="click-do-not-close">When you click on background - modal will NOT close</a>
</p>

#event-modal {
    margin-top: 0;
}