quasar/dist/api/QParallax.json

Build high-performance VueJS user interfaces (SPA, PWA, SSR, Mobile and Desktop) in record time

{
  "type": "component",
  "meta": {
    "docsUrl": "https://v1.quasar.dev/vue-components/parallax"
  },
  "behavior": {
    "$listeners": {
      "desc": "All native events are being propagated (you don't need the '.native' modifier)"
    }
  },
  "props": {
    "src": {
      "type": "String",
      "desc": "Path to image (unless a 'media' slot is used)",
      "transformAssetUrls": true,
      "examples": [
        "(statics folder) src=\"statics/img/something.png\"",
        "(assets folder) src=\"~assets/my-img.png\"",
        "(relative path format) :src=\"require('./my_img.jpg')\"",
        "(URL) src=\"https://some-site.net/some-img.jpg\""
      ],
      "category": "model"
    },
    "height": {
      "type": "Number",
      "desc": "Height of component (in pixels)",
      "default": 500,
      "examples": [
        ":height=\"1000\""
      ],
      "category": "style"
    },
    "speed": {
      "type": "Number",
      "desc": "Speed of parallax effect (0.0 < x < 1.0)",
      "examples": [
        ":speed=\"0.24\""
      ],
      "category": "behavior"
    },
    "scroll-target": {
      "type": [
        "Element",
        "String"
      ],
      "desc": "CSS selector or DOM element to be used as a custom scroll container instead of the auto detected one",
      "examples": [
        ":scroll-target=\"$refs.scrollTarget\"",
        "scroll-target=\".scroll-target-class\"",
        "scroll-target=\"#scroll-target-id\"",
        "scroll-target=\"body\""
      ],
      "category": "behavior",
      "addedIn": "v1.8.0"
    }
  },
  "slots": {
    "default": {
      "desc": "Default slot can be used for content that gets displayed on top of the component"
    },
    "media": {
      "desc": "Slot for describing <img> or <video> tags"
    }
  },
  "scopedSlots": {
    "content": {
      "desc": "Scoped slot for describing content that gets displayed on top of the component; If specified, it overrides the default slot",
      "scope": {
        "percentScrolled": {
          "type": "Number",
          "desc": "Percentage (0.0 < x < 1.0) of scroll in regards to QParallax",
          "examples": [
            0.241
          ]
        }
      }
    }
  },
  "events": {
    "scroll": {
      "desc": "Emitted when scrolling occurs",
      "params": {
        "percentage": {
          "type": "Number",
          "desc": "Number between 0.0 and 1.0 defining the scrolled percentage of the component",
          "examples": [
            0.234
          ]
        }
      }
    }
  }
}