Restarting Counter-Reset
How do I make an restarting counter-reset?
I needed to restart the counter reset after having multiple OLs on a page. A quick jQuery function that handles that. May be cheating but I couldn't find a way to do it with only CSS. What is a restarting counter-reset? How do you make a restarting counter-reset? This script and codes were developed by Xavier Porter on 27 October 2022, Thursday.
Restarting Counter-Reset - Script Codes HTML Codes
<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>Restarting Counter-Reset</title> <link rel="stylesheet" href="css/style.css">
</head>
<body> <ol class="hunt"> <li>Number One</li> <li>Number Two</li> <li>Number Three</li>
</ol>
<ol class="hunt">
<li>Need for an IT alert or change notification is identified.</li>
<ul>
<li>This may occur after a pattern is recognized following several reported incidents. For Texas A&M IT, a parent incident record is created.</li>
<li>Planned maintenance needs to be communicated to the university community.</li>
</ul>
<li>The outage form is submitted by an outage user or outage admin.</li>
<ul>
<li>Outage user: Open an outage from an incident (or problem) by right-clicking the grey header bar and selecting Create Outage.</li>
<ol>
<li>After submitting, user is returned to the incident (or problem) and a banner message appears with the following text, "Outage [Number] has been created successfully for [Task number]".</li>
<li>An email notification is sent to outage admins that a draft outage was submitted.</li>
</ol>
<li>Outage admin: Open an outage from an incident or navigate to Outages (Business Services > Outages) and click New.</li>
<ol>
<li>After creating a new outage from the Outages module (without a Task number), a banner message with the following text, "Outage [Number] has been created successfully".</li>
</ol>
<li>ITIL user or roleless IT administrator: Email <a href="mailto:[email protected]">[email protected]</a> and it will automatically be assigned to the OC. Outage admin can submit the outage form on behalf of individuals without the outage user or outage admin role.</li>
</ul>
</ol>
<ol> <li>Number Ten</li> <li>Number Eleven</li> <li>Number Twelve</li>
</ol> <script src='http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script>
</body>
</html>
Restarting Counter-Reset - Script Codes CSS Codes
ol { list-style: none; counter-reset: olfirst; /* our father OL must have olfirst item reseted */ font-family: arial;
}
ol > li { counter-increment: olfirst;
}
ol ul{ counter-reset:olsecond;
}
ol ul > li { counter-increment:olsecond;
}
ol ul li:before { content:counter(olsecond)' '
}
ol li:before { content: counter(olfirst) ". "; /* let's output our pretty number */ }
Developer | Xavier Porter |
Username | xporter |
Uploaded | October 27, 2022 |
Rating | 3 |
Size | 2,331 Kb |
Views | 16,192 |
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!
Name | Size |
Style tiles with SCSS | 13,579 Kb |
Foundation 5 Menu - Accessibility | 1,999 Kb |
Unsplash.it image viewer | 2,500 Kb |
Quote Styling | 1,769 Kb |
Spotlight Solution 1 | 2,499 Kb |
A Pen by Xavier Porter | 3,680 Kb |
Transforms examples | 1,445 Kb |
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!
Name | Username | Size |
Sort the Knowlege | Eprouver | 3,915 Kb |
A Pen by Michael Parenteau | Michaelparenteau | 2,133 Kb |
Google Maps API Ground Overlay | Boycetrus | 2,961 Kb |
Ball Physics | Getsetbro | 3,149 Kb |
Drill-down Map | Good886 | 8,484 Kb |
Login-ng-modal | Heedoo | 3,566 Kb |
Experiment - SCSS SVG Background Image with Variables | See8ch | 3,270 Kb |
A Pen by Paul Sullivan | Pwsm50 | 2,349 Kb |
CSS Social Media Icon | TychoBlender | 3,871 Kb |
Menubar compass mixin | Michaelparenteau | 4,925 Kb |
Surf anonymously, prevent hackers from acquiring your IP address, send anonymous email, and encrypt your Internet connection. High speed, ultra secure, and easy to use. Instant setup. Hide Your IP Now!