Easy way to create In-Content Editing Slider within Business Catalyst

gistfile1.html

<div class="bxslider">
  <div ice:editable="section" class="slide" style="position: relative;">
    <img alt="" width="1200" height="400" src="http://placehold.it/1200x400" ice:editable="image" />
  </div>
</div>
 
<script>
	$(document).ready(function(){
		if($("bc-skip").length==0){ //not in edit mode, start bxslider
			$('.bxslider').bxSlider();
		} 
		else //we are in edit mode, do not start bx slider and allow scrolling within the bxslider div for editing purposes
		{
			$(".bxslider").parent().css("overflow-y","auto");
		}
	});
</script>