Skip to content

Instantly share code, notes, and snippets.

@rickary
Last active December 17, 2015 21:10
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save rickary/5673207 to your computer and use it in GitHub Desktop.
Save rickary/5673207 to your computer and use it in GitHub Desktop.
Clones content wrapped in a blockquote. Leaves the original blockquote in the body and create a pullquote too. Lovely.
$(document).ready(function() {
$('blockquote').each(function() {
var pullquote=$(this).clone();
pullquote.addClass('pullquote');
$(this).before(quote);
});
});
<style>
blockquote {
display: inline;
margin: 0; padding: 0;
}
blockquote.pullquote {
padding:0;
margin: 30px 30px 30px 0;
float: left;
width:200px;
height: auto;
text-align: left;
border-left: solid 30px black;
padding-left: 10px;
font-size:20px;
color:black;
font-weight:bold;
}
</style>
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sint esse dolor impedit ducimus nostrum fugiat porro distinctio quidem necessitatibus minima ratione voluptates. Hic praesentium architecto libero! Nisi eius dolore aliquam.Lorem ipsum dolor sit amet, consectetur adipisicing elit. Possimus qui error autem assumenda debitis alias itaque quaerat reprehenderit iure nam soluta et cumque illum! Aliquid nam corporis vitae dolorem illo.repellat ut dolores provident expedita eaque nam consectetur. Molestiae repellat enim recusandae porro quaerat a illum soluta velit modi praesentium nisi.sapiente dolores cumque inventore debitis perferendis deserunt quod harum. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Animi facere harum rerum commodi placeat quo esse! Reprehenderit quaerat mollitia dolores neque ex vitae ut harum nulla atque illum nesciunt quo. <blockquote>If you look carefully you'll notice that this text is repeated in the text on the right... hey presto! Inline pull quotes. Not bad for a lunchtime eh?</blockquote> Lorem ipsum dolor sit amet, consectetur adipisicing elit. Animi doloremque ipsa culpa quisquam ea corrupti cumque minus praesentium dolorem Lorem ipsum dolor sit amet, consectetur adipisicing elit. Tempore odio voluptatem officia ut rem natus esse nobis officiis aliquam dolorum sunt quas aspernatur iusto enim molestiae exercitationem optio facere aliquid. diloremgnissimos porro laborum rem mollitia ut quos minima sit optio dolore!Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quo illo excepturi fugit atque alias odio modi impedit blanditiis aliquid non aut vel rerum minima soluta sapiente ex nulla. Quo molestiae!Lorem ipsum dolor sit amet, consectetur adipisicing elit. Tempora eaque beatae accusantium consectetur officia nesciunt laudantium mollitia asperiores cupiditate quae quam delectus corporis eos. Saepe quisquam odio repellendus inventore architecto!ratione cupiditate corporis saepe voluptate quos quae quis tempore error.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment