Story Detail 0.5

Developer
Tom Markart
Size
15,495 Kb
Views
34,408
  1. Story Detail 0.5 Previews
  2. Story Detail 0.5 HTML Codes
  3. Story Detail 0.5 CSS Codes
  4. Story Detail 0.5 JS Codes

How do I make an story detail 0.5?

What is a story detail 0.5? How do you make a story detail 0.5? This script and codes were developed by Tom Markart on 06 November 2022, Sunday.

Story Detail 0.5 Previews
IQ Test

Story Detail 0.5 - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>Story Detail 0.5</title> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/meyer-reset/2.0/reset.min.css"> <link rel='stylesheet prefetch' href='https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.min.css'>
<link rel='stylesheet prefetch' href='https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css'> <link rel="stylesheet" href="css/style.css">
</head>
<body> <header> <div id="masthead-container"> <div class="container"> <div class="masthead-row"> <div class="branding col-xs-12"> <img class="img-responsive" src="http://www.tmarkart.com/codepen/images/no-logo.png" /> </div> </div> </div> </div> <section class="container"> <div class="ad element-spacing-large visible-lg visible-md"> <img src="http://www.tmarkart.com/codepen/images/728x90.jpg" /> </div> <div class="element-spacing-large"> <div class="col-md-8 col-sm-12 story-body"> <div class="primary-asset element-spacing-medium"> <img class="img-responsive" src="http://www.tmarkart.com/codepen/images/story-primary-asset.jpg" /> <div class="current-caption"> <p class="caption-text"> CEOs of major companies are taking stands in regards to the results of the November 2016 U.S. election, a departure from the traditional model of not mixing politics with business that the major brands have long espoused. <strong>Eric Risberg</strong>, File AP Photo </p> </div> <div class="hidden-caption-link visible-xs"> <a class="caption-toggle" href="javascript:void(0);"></a> </div> </div> <div class="col-md-1 visible-lg visible-md" id="social-wrapper"> <div id="social"> <img src="http://www.tmarkart.com/codepen/images/social-icons-vert.png" /> </div> </div> <div class="col-md-11 col-sm-12"> <div class="ad element-spacing-medium visible-xs"> <img src="http://www.tmarkart.com/codepen/images/320x50.jpg" /> </div> <div class="element-spacing-medium"> <h1 class="heading link"> <a href="javascript:void(0);">Business </a> </h1> <p class="published-date"> November 17, 2016 2:51 AM </p> </div> <div class="story-header"> <h1 class="title"> Facebook's fake news problem: What's its responsibility? </h1> </div> <div class="byline element-spacing-small"> By Chip Alexander <p> <a href="javascript:void(0);">[email protected]</a> </p> </div> <div class="visible-sm visible-xs element-spacing-small" id="social-horiz"> <img src="http://www.tmarkart.com/codepen/images/social-icons-horiz.png" /> </div> <div class="video-div"> <img src="http://www.tmarkart.com/codepen/images/video-div-bkgd.jpg" /> <div class="title"> <a href="javascript:void(0);">How social media decides what you see</a> </div> <img class="play" src="http://www.tmarkart.com/codepen/images/video-div-play.png" /> </div> <div class="content-body"> <p> NEW YORK - Facebook is under fire for failing to rein in fake and biased news stories that some believe may have swayed the presidential election. Its predicament stems from this basic conundrum: It exercises great control over the news its users see, but it declines to assume the editorial responsibility that traditional publishers do. </p> <p> On Monday, Facebook took a minor step to address the issue, clarifying its advertising policy to emphasize that it won't display ads on sites that run information that is "illegal, misleading or deceptive, which includes fake news." The company said it was merely making explicit a policy that was already implied. </p> <p> Its move followed a similar step by Google earlier on Monday, after the search giant acknowledged that it had let a false article about the election results slip into its list of recommended news stories. </p> <div class="teads"> <img class="img-responsive" src="http://www.tmarkart.com/codepen/images/teads.jpg" /> </div> <p> In the case of both companies, the aim is to discourage fake-news sites by depriving them of revenue. </p> <div class="visible-xs ad"> <img src="http://www.tmarkart.com/codepen/images/300x250.jpg" /> </div> <p> Facebook is also said to be facing brewing internal turmoil over its influence and what it can and should do about it. </p> <p> Employees have expressed concern over Facebook's role in spreading misinformation and racist memes largely associated with the alt-right, according to The New York Times and BuzzFeed. Some have reportedly formed an unofficial task force to investigate the role the company played in the election. </p> <div class="inline-photo-horiz"> <img src="http://www.tmarkart.com/codepen/images/story-inline-asset.jpg" /> <p class="caption"> Mark Zuckerberg had said at a conference last week that suggestions the US election was influenced by fake news were ‘pretty crazy’. </p> <p class="credit"> Lluis Gene/AFP/Getty Images </p> </div> <p> Founder and CEO Mark Zuckerberg, however, insists that Facebook remains a neutral technology platform where its users can share anything they want, with only a tiny fraction of it fake or problematic. </p> <p> Last week, Zuckerberg called the idea that voters might have been influenced by what they saw on Facebook — fake, uber-partisan stories, such as a false one about Pope Francis endorsing Donald Trump for president — "pretty crazy." </p> <div class="visible-xs ad"> <img src="http://www.tmarkart.com/codepen/images/300x250d.jpg" /> </div> <h3> FACEBOOK CONTROL </h3> <p> People update to Facebook so frequently that the company has no choice but to filter what everyone sees in their news feeds — the main artery through which users see posts from their friends, family, businesses, news sources and celebrities they follow. </p> <div class="inline-photo-vert"> <img src="http://www.tmarkart.com/codepen/images/story-inline-vert.jpg" /> <p class="caption"> "The problem with quotes found on the Internet is that they are often not true." </p> <p class="credit"> Abraham Lincoln </p> </div> <p> The company's secret algorithms are designed to deliver the posts from friends and other sources that will draw people in and lead them to read and click and "like" and share — "maximizing their engagement," in Facebook's jargon. </p> <p> Facebook frequently tweaks its algorithm to improve engagement. Various changes have been aimed at shutting out sites that promote clickbait and other garbage that users say they don't want to see, even as they click on it and share away. When users are surrounded by posts they want to see, they're more likely to stick around. </p> <div class="visible-xs ad"> <img src="http://www.tmarkart.com/codepen/images/300x250c.png" /> </div> <p> That's key to Facebook's advertising business. But it can be problematic when it comes to false but highly interesting posts. </p> <p> Facebook's news feed "maximizes for engagement. As we've learned in this election, bulls-t is highly engaging," former Facebook product designer Bobby Goodlatte wrote in an Election Day post . "Highly partisan, fact-light outlets" on both the right and the left, he wrote, "have no concern for the truth, and really only care for engagement. ... It's now clear that democracy suffers if our news environment incentivizes bulls-t." </p> <div class="highline highline-quote" id="highline-quote-1"> <p> It's now clear that democracy suffers if our news environment incentivizes bulls-t." </p> <p> <span class="ng_highline_attrib">Bobby Goodlatte - Former Facebook product designer</span> </p> </div> <p> Social media companies today have to acknowledge that they are news organizations, said Jeffrey Herbst, president and CEO of the Newseum, a journalism museum in Washington. "Not like news companies of the 20th century," he added. "But not just pipes where people get their news. They determine what is news." </p> <p> In a post Saturday night, Zuckerberg rejected that idea. </p> <p> "News and media are not the primary things people do on Facebook, so I find it odd when people insist we call ourselves a news or media company in order to acknowledge its importance," he wrote. "Facebook is mostly about helping people stay connected with friends and family." </p> <div class="inline-photo-mug"> <img src="http://www.tmarkart.com/codepen/images/story-inline-mug.jpg" /> <p class="caption"> Despite being fake, this photo ploliferated millions of Facebook user's walls leading up to the election. </p> <p class="credit"> Anonymous </p> </div> <h3> FACEBOOK AS NEWSPAPER — NO, SCRATCH THAT </h3> <p> Back in 2013, Zuckerberg said he wanted Facebook to be people's "own personal newspaper," one that delivers the stories most interesting and important to them. That's still the company's goal — though minus any reference to itself as a media company of any kind. </p> <p> Of course, fake stuff has existed on the internet long before Facebook. And under the law, Facebook is no more responsible for what appears on its site than "the paper mills that print newspapers are responsible for their content," said Steve Jones, a professor at the University of Illinois at Chicago who studies communication technology. </p> <p> At the same time, Jones said he thinks the broader issue of Facebook's responsibility is one that's going to be "debated forever." </p> <p> "Even the notion of truth is something that's highly contested at this point," he said. </p> <div class="story-related element-spacing-small" id="story-related"> <h1> Related content </h1> <div id="related-links"> <article class="business"> <div class="teaser"> <h4 class="title"> <a href="javascript:void(0);">Google fooled by fake election news</a> </h4> </div> </article> <article class="celebrity"> <div class="teaser"> <h4 class="title"> <a href="javascript:void(0);"> Zuckerberg: 'Crazy' to say Facebook influenced election</a> </h4> </div> </article> </div> </div> <div id="sub-cta"> <a class="btn btn-primary audience-cta" href="#" role="button">Get up to 75% off subscription.</a> </div> </div> <section class="element-spacing-large" id="aggrego"> <h1 class="heading link element-spacing-small"> <a href="javascript:void(0);">You May Like</a> </h1> <div class="aggrego"> Aggrego </div> </section> <section class="element-spacing-large" id="comments"> <h1 class="heading link element-spacing-small"> <a href="javascript:void(0);">Comments</a> </h1> <div class="comments"> Comments </div> </section> <section class="element-spacing-large" id="nativo"> <div class="nativo"> Nativo Sponsored Content </div> </section> </div> </div> <div class="col-md-4 col-sm-12 right-rail"> <div class="ad visible-lg visible-md"> <img src="http://www.tmarkart.com/codepen/images/300x600b.jpg" /> </div> <section class="video-widget headline-list element-spacing-large"> <h1 class="heading link element-spacing-small"> <a href="javascript:void(0);">Video Widget</a> </h1> <article class="business"> <div class="teaser"> <a href="javascript:void(0);"><img class="embed-play" src="http://www.tmarkart.com/codepen/images/video-01-play.jpg" /> <h2 class="title"> Here’s 4 things you need to know about the new iPhone 7 </h2> </a> <div class="clearfix"></div> </div> </article> <article class="business"> <div class="teaser"> <a href="javascript:void(0);"><img class="media" src="http://www.tmarkart.com/codepen/images/video-01.jpg" /> <h2 class="title"> Here’s 4 things you need to know about the new iPhone 7 </h2> </a> <div class="clearfix"></div> </div> </article> <article class="business"> <div class="teaser"> <a href="javascript:void(0);"><img class="media" src="http://www.tmarkart.com/codepen/images/video-02.png" /> <h2 class="title"> Rare double eclipse captured in space </h2> </a> <div class="clearfix"></div> </div> </article> <article class="business"> <div class="teaser"> <a href="javascript:void(0);"><img class="media" src="http://www.tmarkart.com/codepen/images/video-03.jpg" /> <h2 class="title"> First Look at World War II Shipwrecks Off NC Coast </h2> </a> <div class="clearfix"></div> </div> </article> <p class="readmore"> <a href="javascript:void(0);">More From Video</a> </p> </section> <div class="clearfix"></div> <div class="ad visible-lg visible-md"> <img src="http://www.tmarkart.com/codepen/images/300x250.jpg" /> </div> <div class="free-html"> Free HTML Widget </div> <section class="headline-list element-spacing-large" id="more-stories-widget"> <h1 class="heading link element-spacing-small"> <a href="javascript:void(0);">Business</a> </h1> <article class="carolina_hurricanes media"> <div class="teaser"> <h2 class="title"> <a href="javascript:void(0);">Wal-Mart kicks off Cyber Monday on Friday</a> </h2> </div> </article> <article class="carolina_hurricanes media"> <div class="teaser"> <h2 class="title"> <a href="javascript:void(0);">Trump's vow to revive coal country is met with measured hope</a> </h2> </div> </article> <article class="carolina_hurricanes media"> <div class="teaser"> <h2 class="title"> <a href="javascript:void(0);">Plans for NC pipeline draw protests	</a> </h2> </div> </article> <article class="carolina_hurricanes media"> <div class="teaser"> <h2 class="title"> <a href="javascript:void(0);">Citigroup approves plan to buy back $1.75 billion in stock</a> </h2> </div> </article> <article class="carolina_hurricanes media"> <div class="teaser"> <h2 class="title"> <a href="javascript:void(0);">China's Fosun builds stake in Portugal's biggest bank</a> </h2> </div> </article> <p class="readmore"> <a href="javascript:void(0);">More From Business</a> </p> </section> <div class="clearfix"></div> <div class="ad visible-lg visible-md"> <img src="http://www.tmarkart.com/codepen/images/300x600.jpg" /> </div> <h1 class="heading link element-spacing-small"> <a href="javascript:void(0);">Editor's Choice Videos</a> </h1> <div class="ndn element-spacing-large"> <img src="http://www.tmarkart.com/codepen/images/ndn.jpg" /> </div> <div class="ad visible-lg visible-md"> <img src="http://www.tmarkart.com/codepen/images/300x250b.jpg" /> </div> <div class="ad visible-lg visible-md"> <img src="http://www.tmarkart.com/codepen/images/300x250c.png" /> </div> </div> </div> <div class="clearfix"></div> <div class="ad element-spacing-medium visible-lg visible-md"> <img src="http://www.tmarkart.com/codepen/images/728x90b.jpg" /> </div> <div class="ad element-spacing-medium visble-sm visible-xs"> <img src="http://www.tmarkart.com/codepen/images/320x50.jpg" /> </div> </section>
</header>
<footer></footer> <script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.min.js'></script> <script src="js/index.js"></script>
</body>
</html>

Story Detail 0.5 - Script Codes CSS Codes

.element-spacing-large { margin-bottom: 40px;
}
.element-spacing-medium { margin-bottom: 20px !important;
}
.element-spacing-small { margin-bottom: 15px !important;
}
.readmore { display: inline; float: right; font-size: 14px; font-family: 'McClatchy Sans Cond', 'Roboto Condensed Medium', 'HelveticaNeue-CondensedBold', sans-serif; font-weight: 600; line-height: 1; margin: 5px 0 40px 0; text-transform: uppercase;
}
.readmore a { color: #ba2814; text-decoration: none;
}
.readmore a:after { content: "\f0a9"; font-family: FontAwesome; font-size: 20px; margin-left: 4px; vertical-align: -2px;
}
/* ----- Member Center ----- */
#masthead-container { background: rgba(0, 0, 0, 0.8); margin-bottom: 0; padding: 10px 0; position: relative;
}
.branding { float: left; max-width: 75%; margin-bottom: 15px;
}
ul.nav-links { margin-bottom: 0;
}
ul.nav-links li { float: left; font-family: 'McClatchy Sans Cond', 'Roboto Condensed Medium', 'HelveticaNeue-CondensedBold', sans-serif; font-size: 16px; padding: 0 10px; text-transform: uppercase;
}
ul.nav-links li a { color: #fff; font-weight: 500;
}
/* ----- Ads ----- */
.ad { text-align: center; margin-bottom: 40px;
}
/* ----- Story Content ----- */
h1.heading { display: inline-block; font-family: 'McClatchy Sans Cond', 'Roboto Condensed Medium', 'HelveticaNeue-CondensedBold', sans-serif; font-size: 14px; font-weight: 600; line-height: 1; margin: 0; text-transform: uppercase;
}
h1.heading a { color: #ba2814; text-decoration: none;
}
.published-date { color: #adadad; display: inline-block; font-family: 'McClatchy Sans Cond', 'Roboto Condensed Medium', 'HelveticaNeue-CondensedBold', sans-serif; font-size: 14px; float: right; text-transform: uppercase;
}
h1.title { font-family: 'McClatchy Slab', Georgia, Times, 'Times New Roman', serif; font-size: 30px; font-weight: normal; line-height: 1.2; margin: 10px 0 15px 0;
}
.byline { color: #000; font-family: 'McClatchy Sans Cond', 'Roboto Condensed Medium', 'HelveticaNeue-CondensedBold', sans-serif; font-size: 16px; margin-bottom: 25px; padding-bottom: 3px; text-transform: uppercase;
}
.byline a { color: #9e9ca1;
}
.byline p { margin: 0;
}
/* ----- Div Video -----*/
.video-div { margin-bottom: 25px; position: relative;
}
.video-div img { width: 100%;
}
.video-div .title { font-family: 'McClatchy Sans', Arial, 'Helvetica Neue', Helvetica, sans-serif !important; font-size: 16px; left: 10px; position: absolute; top: 10px;
}
.video-div .title a { color: #fff; text-decoration: none;
}
.video-div img.play { left: 43%; position: absolute; top: 40%; width: 15%;
}
/* ----- Social Icons -----*/
.social-icons-top { position: relative;
}
.social-icons-float { position: fixed; top: 60px;
}
.social-fix { background-color: #ff0; position: fixed; top: 20px;
}
#social-horiz { text-align: center;
}
/* ----- Story Wrapper -----*/
.content-body { border-bottom: 3px solid #888; margin-bottom: 40px;
}
.content-body p { font-family: 'Lyon', Georgia, serif; font-size: 17px; line-height: 1.5; margin-bottom: 1em;
}
.content-body h3 { font-family: font-slab; font-size: 20px; font-weight: bold;
}
/* ----- Primary Asset ----- */
.primary-asset { margin-left: -30px; margin-right: -30px; position: relative; z-index: 100;
}
.current-caption { background-color: rgba(0, 0, 0, 0.5); color: #fff; position: absolute; bottom: 0;
}
.current-caption .caption-text { padding: 10px;
}
.hidden-caption { background-color: rgba(0, 0, 0, 0.5); bottom: 0; padding: 10px; position: absolute; right: 0;
}
.hidden-caption a { color: #fff;
}
.hidden-caption a.caption-toggle { text-decoration: none;
}
.hidden-caption-link { height: 100%; position: absolute; top: 0; width: 100%; z-index: 1000;
}
.hidden-caption-link a { height: 100%; position: absolute; width: 100%;
}
/* ----- Teads ----- */
.teads { margin: 1em auto; text-align: center;
}
/* ----- Inline Photo Asset - Horizontal ----- */
.inline-photo-horiz { border-bottom: 3px solid #888; margin-bottom: 25px;
}
.inline-photo-horiz img { margin-bottom: 15px; width: 100%;
}
.inline-photo-horiz p.caption { font-family: 'McClatchy Sans', Arial, 'Helvetica Neue', Helvetica, sans-serif !important; font-size: 14px; line-height: 20px; margin-bottom: 10px;
}
.inline-photo-horiz p.credit { font-family: 'McClatchy Sans', Arial, 'Helvetica Neue', Helvetica, sans-serif !important; font-size: 12px; font-weight: bold; margin-bottom: 15px;
}
/* ----- Inline Photo Asset - Vertical ----- */
.inline-photo-vert { border-bottom: 3px solid #888; float: left; margin: 0 20px 25px 0; width: 100%;
}
.inline-photo-vert img { margin-bottom: 15px; width: 100%;
}
.inline-photo-vert p.caption { font-family: 'McClatchy Sans', Arial, 'Helvetica Neue', Helvetica, sans-serif !important; font-size: 14px; line-height: 20px; margin-bottom: 10px;
}
.inline-photo-vert p.credit { font-family: 'McClatchy Sans', Arial, 'Helvetica Neue', Helvetica, sans-serif !important; font-size: 12px; font-weight: bold; margin-bottom: 15px;
}
/* ----- Inline Photo Asset - Mugshot ----- */
.inline-photo-mug { border-bottom: 3px solid #888; float: left; margin: 0 20px 25px 0; width: 100%;
}
.inline-photo-mug img { float: left; margin: 0 10px 15px 0; width: 50%;
}
.inline-photo-mug p.caption { font-family: 'McClatchy Sans', Arial, 'Helvetica Neue', Helvetica, sans-serif !important; font-size: 14px; line-height: 20px; margin-bottom: 10px;
}
.inline-photo-mug p.credit { font-family: 'McClatchy Sans', Arial, 'Helvetica Neue', Helvetica, sans-serif !important; font-size: 12px; font-weight: bold; margin-bottom: 15px;
}
/* ----- Highlight ----- */
.highline-quote { color: #ba2814; font-family: 'McClatchy Sans Cond', 'Roboto Condensed Medium', 'HelveticaNeue-CondensedBold', sans-serif; font-weight: 600; text-align: center; text-transform: uppercase; padding-bottom: 15px; position: relative;
}
.highline { border-top: 2px dotted #ccc; border-bottom: 3px solid #888; margin: 30px 0; clear: both;
}
.highline-quote:before { content: "\201C"; font-family: 'McClatchy Slab', Georgia, Times, 'Times New Roman', serif; font-size: 60px; background-color: #fff; color: #000; position: absolute; line-height: 1; top: -10px; padding: 0 7px; max-height: 30px; left: 50%; margin-left: -20px;
}
.highline-quote p:first-child { margin-top: 20px;
}
.highline-quote p { margin: 0; font-size: 20px; line-height: 1.2; font-family: 'McClatchy Sans Cond', 'Roboto Condensed Medium', 'HelveticaNeue-CondensedBold', sans-serif;
}
.highline-quote .ng_highline_attrib { font-family: 'McClatchy Sans', Arial, 'Helvetica Neue', Helvetica, sans-serif !important; font-size: 13px; color: #000; text-transform: none; font-weight: normal; display: block; margin-top: 5px;
}
/* ----- Related Content ----- */
.story-related { border-top: 2px dotted #ccc; margin: 40px 0 0 0;
}
.story-related h1 { color: #ba2814; font-family: 'McClatchy Sans Cond', 'Roboto Condensed Medium', 'HelveticaNeue-CondensedBold', sans-serif; font-size: 14px; font-weight: 600; margin-bottom: 15px; text-transform: uppercase;
}
.story-related .title { font-family: 'McClatchy Sans', Arial, 'Helvetica Neue', Helvetica, sans-serif !important; font-size: 16px; margin-bottom: 25px; padding: 0 4px;
}
.story-related .title a { color: #000; text-decoration: none;
}
.story-related .title a:hover { color: #0d76ba;
}
.audience-cta { margin-bottom: 25px; padding: 15px 0; text-align: center; text-transform: uppercase; width: 100%;
}
/* ----- Right Rail ----- */
.headline-list article { border-bottom: 1px solid #dcdcdc; margin-bottom: 10px; padding-bottom: 10px; margin-top: 0;
}
.headline-list article:last-child { margin-bottom: 0;
}
.headline-list .title { font-size: 16px; font-family: 'McClatchy Sans', Arial, 'Helvetica Neue', Helvetica, sans-serif !important; font-weight: 500; line-height: 20px; margin: 5px 0;
}
.headline-list .title a { color: #000; text-decoration: none;
}
.headline-list .title a:hover { color: #0d76ba;
}
.video-widget article { width: 100%;
}
.video-widget article img.media { float: left; padding-right: 15px; width: 50%;
}
.video-widget article img.embed-play { margin-bottom: 15px; width: 100%;
}
.video-widget article a { color: #000; text-decoration: none;
}
.ndn { width: 100%;
}
.ndn img { width: 100%;
}
.free-html,
.aggrego,
.comments,
.nativo { background-color: #ccc; font-weight: bold; height: 300px; margin-bottom: 30px; padding-top: 130px; text-align: center;
}
.nativo { height: 120px; padding-top: 50px;
}
/* ----- Footer ----- */
footer { background: #424242; height: 300px;
}
@media screen and (min-width: 768px) { #masthead-container { margin-bottom: 20px; } h1.title { font-size: 34px; line-height: 1.3; } .primary-asset { margin-left: 15px; margin-right: 15px; } /* ----- Primary Asset Caption ----- */ .current-caption { background-color: rgba(0, 0, 0, 0); color: #000; padding-top: 10px; position: relative; } .current-caption .caption-text { padding: 0; margin-right: 0; } /* ----- Inline Photo Asset - Vertical ----- */ .inline-photo-vert { width: 50%; } /* ----- Inline Photo Asset - Mugshot ----- */ .inline-photo-mug { width: 50%; } /* ----- Div Video -----*/ .video-div .title { font-size: 20px; }
}
@media screen and (min-width: 992px) { /* ----- Story Content ----- */ h1.title { font-size: 45px; line-height: 1.3; }
}

Story Detail 0.5 - Script Codes JS Codes

$(document).ready(function(){ // ----- Primary Caption Toggle ----- $(window).resize(function() { // This will fire each time the window is resized: if($(window).width() >= 740) { $('.current-caption').show(); } else { $('.current-caption').hide(); } }).resize(); // This will simulate a resize to trigger the initial run. $(".caption-toggle").click(function(){ $(".current-caption").slideToggle(250); //$(".hidden-caption").hide(); }); // ----- Social Icons Lock -----	$(window).scroll(function(){ var sPos = $(window).scrollTop(); if( sPos <= 725 ){ $('#social').removeClass(); $('#social').addClass('social-icons-top'); } if( sPos > 725 ){ $('#social').removeClass(); $('#social').addClass('social-icons-float'); }	});
});
Story Detail 0.5 - Script Codes
Story Detail 0.5 - Script Codes
Home Page Home
Developer Tom Markart
Username tmarkart
Uploaded November 06, 2022
Rating 3
Size 15,495 Kb
Views 34,408
Do you need developer help for Story Detail 0.5?

Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!

Tom Markart (tmarkart) Script Codes
Name
CSS truncation with ellipsis
Responsive nav
Story Card Expand Details
Google Matched Content - rendered
Vertical Image Filler
Election Widget Combo
Story Detail 1.0 - related content - no images
Select2
Template - responsive story detail
Election static page
Create amazing marketing copy with AI!

Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!