Stack Overflow
Stack Overflow

Questions tagged [codepen]

CodePen is a website hosting runnable HTML/CSS/JS code snippets for testing and sharing. Use this tag if you have a question about using or configuring the CodePen site itself, or why code hosted on CodePen behaves differently than code hosted elsewhere. DO NOT use this tag just because your code is hosted on CodePen, and your problem is otherwise unrelated to the CodePen site.

CodePen is a playground for the front end web.

Show off your latest creation and get feedback. Build a test case for that pesky bug. Find example design patterns and inspiration for your projects.

Documentation

https://blog.codepen.io/documentation/

Support

http://codepen.io/support/

549 questions
14
votes
7 answers

how to use react in Codepen with es6

http://codepen.io/JessieZhou/pen/VPgMdP ,Here is a demo using React in CodePen, but the browser gives an error "Uncaught ReferenceError: Component is not defined". However, if I insert a line "import {Component} from 'react'" in the first line, the…
JessieZhou
  • 163
  • 1
  • 1
  • 6
12
votes
1 answer

Why does this SVG image have a height of 150px

Why is this SVG image displayed at 150px height inside this 500px container? Why this specific value? I found this weird behavior in both js bin and Codepen, so I think it is something to do with my code and not with the online editors. Note: a…
AIon
  • 12,521
  • 10
  • 47
  • 73
11
votes
3 answers

React prop-types error

I'm trying to create web app in codepen. I'm using React, ReactDOM. All was fine. But when I added react-router-dom to my project, I got an error: react-router-dom.min.js:1 Uncaught Error: Cannot find module "prop-types" How can I fix this?
Leonid Gordun
  • 361
  • 1
  • 4
  • 14
9
votes
2 answers

How does this React code work on CodePen even if no preprocessor is selected?

I have this code on CodePen: https://codepen.io/anon/pen/OdOyJX that works perfectly, and I am confused about why this works. ReactDOM.render(
Hello, world!
, document.getElementById('root') ); In the JavaScript settings, there is no…
Hamdi Douss
  • 1,033
  • 1
  • 8
  • 17
9
votes
2 answers

Get bounding box of SVG path

I want exactly what this page do http://codepen.io/netsi1964/full/vNoemp/ I have the path and need to know it's bounding box as a rect element, it's x,y,width and height given code
rafat mansour
  • 103
  • 1
  • 1
  • 6
8
votes
6 answers

Using font awesome in codepen

I'm trying to add the styles sheet for font-awesome into a Codepen but seem to be getting nowhere, can anybody help please. Codepen (https://codepen.io/kellett/pen/YreKaW) Below is the styles sheet I've inserted in the top of HTML page.
user8542715
7
votes
1 answer

TypeError: Failed to set the 'buffer' property on 'AudioBufferSourceNode': The provided value is not of type 'AudioBuffer

I am working on the existing codoCircle. Put the volume down. It works out as expected. Now i want to use the same code here in codepen and i get this error TypeError: Failed to set the 'buffer' property on 'AudioBufferSourceNode': The provided…
Koala7
  • 1,340
  • 7
  • 41
  • 83
6
votes
4 answers

Bad path /boomboom/v2/index.html error message when trying to assign event handlers

I'm writing an event handler in Javascript on Codepen that will take a form input and add it to an unordered list. When trying to test, I get a "bad path /boomboom/v2/index.html" error message. I'm not sure if this error is a result of my code or an…
Raquel Ocasio
  • 63
  • 1
  • 5
6
votes
3 answers

Using Javascript ES6 import and export functionality in Codepen projects

I am trying to use the Javascript ES6 import/export functionality in my Codepen project, and I thought it was supported based on some articles I read, but I am having trouble getting it to work. I have set my Codepen project to use Webpack and Babel…
Sergei Wallace
  • 1,129
  • 4
  • 16
  • 26
5
votes
1 answer

How would I link a File Input to a source of an Object Embed

How would I link any media files (swfs/mp4/mp3/png/other media embed files) to the source of my object embed: basically I want this: to send the uploaded file (preferably an swf) to the Data and Value sources:
Mister SirCode
  • 1,575
  • 14
  • 31
4
votes
2 answers

my canvas drawing app won't work on mobile

I've been learning about HTML canvas lately and made a simple drawing app that works perfect on desktop. But on mobile I can't get a continuous line to draw, only single dots. any idea what I'm doing wrong? link to my codepen build…
Ryan Rigley
  • 65
  • 1
  • 5
4
votes
1 answer

iFrame sandbox not allowing top navigation

I am embedding an iframe into codepen to be able to play with some CSP settings My iFrame is set as follows with the sandbox attributes set