Knockout - tooltip binding handler

From Ryan Niemeyer http://jsfiddle.net/rniemeyer/Rvs8e/

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.2/knockout-min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout.mapping/2.4.1/knockout.mapping.min.js"></script>
<ul id="links" data-bind="foreach: links">
    <li data-bind="text: name"></li>
</ul>

<hr/>

<div class="tooltip" data-bind="tooltip: tipModel"></div>

CSS

.tooltip { position: absolute; }
.tooltip iframe { width: 800px; height: 500px; }
li { margin: 30px; }

JavaScript

ko.bindingHandlers.tooltip = {
    init: function(element, valueAccessor, allBindingsAccessor, viewModel) {
        var model = ko.utils.unwrapObservable(valueAccessor());
        
        //use an iframe for this sample and just set the src
        $(element).append("<iframe />");
                                
        //handle open
        ko.computed({
            read: function() {
                if (model.isOpen()) {
                   $(element).show();   
                } else {
                   $(element).hide();   
                }
            }, 
            disposeWhenNodeIsRemoved: element 
        });
                   
        //handle location
        ko.computed({
            read: function() {
                var location = model.location();
                $(element).css("top", location.top + "px").css("left", location.left + "px");
            },
            disposeWhenNodeIsRemoved: element 
        });
        
        //handle content
        ko.computed({
            read: function() {
                var data = model.data();
                if (model.getUrlFormat && data) {
                    //if "this" is already bound, then can use first arg
                    var url = model.getUrlFormat.call(data, data);  
                    $(element).find("iframe").attr("src", url);
                }
            },
            disposeWhenNodeIsRemoved: element 
        }); 
    },
    BindingModel: function(config) {
        config = config || {};
        var self = this;
        self.data = ko.observable();
        self.isOpen = ko.observable(config.isOpen);
        self.location = ko.observable({
            left: config.left || 0,
            top: config.top || 0
        });
        self.getUrlFormat = config.urlFormatter;
        
        self.open = function(data, top, left) {
            self.data(data);
            self.location({ top: top + 20, left: left });
            self.isOpen(true);
        };
        
        self.close =...