     _toggle_popup: ->
       animations = {
         opacity: [ { opacity: 0 }, { opacity: 1 } ],
-        left: [ { left: -@config.width }, { left: 0 } ],
-        right: [ { right: -@config.width }, { right: 0 } ],
-        top: [{ top: -@config.height }, { top: 0 } ],
-        bottom: [{ bottom: -@config.height }, { bottom: 0 } ]
+        left: [ { left: "-#{@config.width}" }, { left: 0 } ],
+        right: [ { right: "-#{@config.width}" }, { right: 0 } ],
+        top: [{ top: "-#{@config.height}" }, { top: 0 } ],
+        bottom: [{ bottom: "-#{@config.height}" }, { bottom: 0 } ]
       }
       animation_popup = animations[@config.animation_popup] || @config.animation_popup
       animation_overlay = animations[@config.animation_overlay] || @config.animation_overlay


      if @config.width && !(@config.style in ["top", "bottom"])
        @$popup.css({ width: @config.width })
        @$popup.css({ "margin-left": -@config.width/2 }) if @config.style == "center"
      if @config.height && !(@config.style in ["left", "right"])
        @$popup.css({ height: @config.height })
        @$popup.css({ "margin-top": -@config.height/2 }) if @config.style == "center"

      $("body").append(@$overlay, @$popup)

    _set_callbacks: ->
      if @config.hide_on_click_overlay


    _hide_scroll: (elem = "body") ->
      if @config.disable_page_scroll
        $(elem).css({ overflow: "hidden", "padding-right": @_get_scrollbar_width(elem) })

    _show_scroll: (elem = "body") ->
      if @config.disable_page_scroll
