{"id":18383580,"url":"https://github.com/pfelements/pf-parallax-video","last_synced_at":"2026-01-21T22:31:58.992Z","repository":{"id":135770059,"uuid":"88768923","full_name":"PFElements/pf-parallax-video","owner":"PFElements","description":"Polymer 2.0 based custom-element to display video with parallax effect and overlays.","archived":false,"fork":false,"pushed_at":"2017-06-10T18:11:45.000Z","size":73587,"stargazers_count":2,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-04-19T05:54:28.011Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"HTML","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/PFElements.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2017-04-19T16:53:27.000Z","updated_at":"2018-06-08T19:14:33.000Z","dependencies_parsed_at":null,"dependency_job_id":"85c02043-32fa-4f4e-a4ec-d28535a46fc7","html_url":"https://github.com/PFElements/pf-parallax-video","commit_stats":null,"previous_names":[],"tags_count":2,"template":false,"template_full_name":null,"purl":"pkg:github/PFElements/pf-parallax-video","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/PFElements%2Fpf-parallax-video","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/PFElements%2Fpf-parallax-video/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/PFElements%2Fpf-parallax-video/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/PFElements%2Fpf-parallax-video/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/PFElements","download_url":"https://codeload.github.com/PFElements/pf-parallax-video/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/PFElements%2Fpf-parallax-video/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":28645549,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-01-21T21:29:11.980Z","status":"ssl_error","status_checked_at":"2026-01-21T21:24:31.872Z","response_time":86,"last_error":"SSL_connect returned=1 errno=0 peeraddr=140.82.121.5:443 state=error: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-11-06T01:11:53.819Z","updated_at":"2026-01-21T22:31:58.978Z","avatar_url":"https://github.com/PFElements.png","language":"HTML","funding_links":[],"categories":[],"sub_categories":[],"readme":"\n# pf-elements\nA Polymer 2.0 based collection of reusable web components \n\n[![Join the chat at https://gitter.im/pf-elements/Lobby](https://badges.gitter.im/pf-elements/Lobby.svg)](https://gitter.im/pf-elements/Lobby?utm_source=badge\u0026utm_medium=badge\u0026utm_campaign=pr-badge\u0026utm_content=badge)\n[![Published on webcomponents.org](https://img.shields.io/badge/webcomponents.org-published-blue.svg)](https://www.webcomponents.org/element/PFElements/pf-calendar-events)\n[![Polymer Version](https://img.shields.io/badge/polymer-v2-blue.svg)](https://www.polymer-project.org)\n\n## Demo\n[Click here for Demo](https://pfelements.github.io/pf-parallax-video)\n\n\n## Install the Polymer-CLI\n\nFirst, make sure you have the [Polymer CLI](https://www.npmjs.com/package/polymer-cli) installed. Then run `polymer serve` to serve your application locally.\n\n# PF Parallax Video\n\nA Polymer 2.0 based custom-element to display video with parallax effect and overlays.\n\n| Element Name | Latest Version (Bower) | Npm version  | Build Status |\n|--------------|------------------------|--------------|--------------|\n| [pf-parallax-video](https://github.com/PFElements/pf-parallax-video) | [![GitHub version](https://badge.fury.io/gh/PFElements%2Fpf-parallax-video.svg)](https://badge.fury.io/gh/PFElements%2Fpf-parallax-video) | [![npm version](https://badge.fury.io/js/pf-parallax-video.svg)](https://www.npmjs.com/package/pf-parallax-video) |[![Build Status](https://travis-ci.org/PFElements/pf-parallax-video.svg?branch=master)](https://travis-ci.org/PFElements/pf-parallax-video) | \n\n## Learn more\n\nSee the list of elements, demos, and documentation by browsing this collection on webcomponents.org:\n\n### [Take me to webcomponents.org ›](https://www.webcomponents.org/element/PFElements/pf-parallax-video)\n\n---\n#Usage\n\n`\u003cpf-parallax-video id=\"pf-parallax\"\n                     title=\"PF PARALLAX VIDEO\"\n                     videoposter=\"/media/poster.PNG\"\n                     src1=\"../media/main.mp4\"\n                     parallaxvalue=\"0.30\"\n  \u003e\u003c/pf-parallax-video\u003e` \n\n\nCustom property                         | Description                               | Default\n----------------------------------------|-------------------------------------------|------------------------\n`--pf-parallax-video-height`            |  Height of video div                      | 500px\n`--on-pause-video-fade-color`           |  A transprent color when video is paused  | rgba(0,0,0,.85)\n`--overlay-pattren-img`                 |  A pattren image on video                 | media/imgs/pattren.png\n`--pause-button-img`                    |  Video Pause button image                 | url(media/imgs/ic_pause.png) left top no-repeat\n`--play-button-img`                     |  Video Play button image                  | media/imgs/ic_play.png) left top no-repeat\n`--title-heading-disply`                |  'none' if you want to hide heading       | block\n`--title-heading-bg`                    |  Background color of heading              | rgba(0,0,0,.5)\n`--title-text-color`                    |  Heading text color                       | #fff\n\n###Inline Demo\n\u003c!---\n```\n\u003ccustom-element-demo\u003e\n  \u003ctemplate\u003e\n    \u003cscript src=\"../webcomponentsjs/webcomponents-lite.js\"\u003e\u003c/script\u003e\n    \u003clink rel=\"import\" href=\"pf-parallax-video\"\u003e\n    \u003cnext-code-block\u003e\u003c/next-code-block\u003e\n  \u003c/template\u003e\n\u003c/custom-element-demo\u003e\n```\n--\u003e\n```html\n\n\n\n\n\u003cpf-parallax-video id=\"pf-parallax\"\n                     title=\"PF PARALLAX VIDEO\"\n                     videoposter=\"/media/poster.PNG\"\n                     src1=\"../media/main.mp4\"\n                     parallaxvalue=\"0.30\"\n  \u003e\u003c/pf-parallax-video\u003e\n```\n###Known Issues\nGoogle  Chrome doesn't catch any videos over 5MB\nso if your video is above 5mb ,it resulted redownload the video in loop\n## Viewing Your Application\n\n```\n$ polymer serve\n```\n\n## Building Your Application\n\n```\n$ polymer build\n```\n\nThis will create a `build/` folder with `bundled/` and `unbundled/` sub-folders\ncontaining a bundled (Vulcanized) and unbundled builds, both run through HTML,\nCSS, and JS optimizers.\n\nYou can serve the built versions by giving `polymer serve` a folder to serve\nfrom:\n\n```\n$ polymer serve build/bundled\n```\n\n## Running Tests\n\n```\n$ polymer test\n```\n\nYour application is already set up to be tested via [web-component-tester](https://github.com/Polymer/web-component-tester). Run `polymer test` to run your application's test suite locally.\n\n## Contributing\n\nComments, questions, suggestions, issues, and pull requests are all welcome.\n\n### Get in touch with the team\n\nJoing us at [![Join the chat at https://gitter.im/pf-elements/Lobby](https://badges.gitter.im/pf-elements/Lobby.svg)](https://gitter.im/pf-elements/Lobby?utm_source=badge\u0026utm_medium=badge\u0026utm_campaign=pr-badge\u0026utm_content=badge)\n\n- [Twitter](\u003ca href=\"https://twitter.com/polymerio\" class=\"twitter-follow-button\" data-show-count=\"false\"\u003eFollow @polymerio\u003c/a\u003e)\n- [Facebook] (https://www.facebook.com/polymerjs)\n- [Google+] (https://plus.google.com/116168214823506639166) \n- [YouTube] (https://www.youtube.com/channel/UCDKqvDyAn_QTBvCPvrZKTkw) \n- [Website] (https://polymerjs.io)\n\n### Some ways to help:\n\n- **Test the elements and provide feedback**: We would love to hear your feedback on anything related to the elements, like features, API and design. The best way to start is by trying them out. And to get a quick response, either drop a question/comment on the chat or open an issue in GitHub.\n- **Report bugs**: File issues for the elements in their respective GitHub projects.\n- **Send pull requests**: If you want to contribute code, check out the development instructions below.\n\nWe encourage you to read the [contribution instructions by GitHub](https://guides.github.com/activities/contributing-to-open-source/#contributing) also.\n\n## License\n\nMIT License\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fpfelements%2Fpf-parallax-video","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fpfelements%2Fpf-parallax-video","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fpfelements%2Fpf-parallax-video/lists"}