Skip to content

Popup Captcha

A modal wrapper around the slider or click captcha. Trigger it by an element click, or programmatically via show() / hide().

Example

javascript
import { PopupCaptcha } from '@captcha-pro/core'

const popup = new PopupCaptcha({
  trigger: '#submit-btn',
  type: 'slider', // 'slider' | 'click'
  modal: {
    title: 'Security Verification',
    maskClosable: true,
    escClosable: true,
    showClose: true
  },
  captchaOptions: { width: 300, height: 170, precision: 5 },
  autoClose: true,
  closeDelay: 500,
  onSuccess: () => console.log('Verification passed!'),
  onOpen: () => console.log('Popup opened'),
  onClose: () => console.log('Popup closed')
})

popup.show()         // Show popup
popup.hide()         // Hide popup
popup.isVisible()    // Get visibility state
popup.getCaptcha()   // Get inner captcha instance

Options

OptionTypeDefaultDescription
triggerstring | HTMLElement-Trigger element or selector
type'slider' | 'click''slider'Captcha type
captchaOptionsobject-Options for inner captcha
modalPopupModalOptions-Modal options
autoClosebooleantrueAuto close on success
closeDelaynumber500Delay before close (ms)
onOpen() => void-Called when popup opens
onClose() => void-Called when popup closes
onSuccess() => void-Success callback
onFail() => void-Fail callback

PopupModalOptions

OptionTypeDefaultDescription
titlestring-Modal title
maskClosablebooleantrueClick mask to close
escClosablebooleantruePress ESC to close
showClosebooleantrueShow close button

Instance Methods

MethodDescription
show()Show popup modal
hide()Hide popup modal
isVisible()Get visibility state
getCaptcha()Get inner captcha instance
destroy()Destroy popup instance

Released under the MIT License.