Skip to content

Instantly share code, notes, and snippets.

View softiconic's full-sized avatar

Softiconic softiconic

View GitHub Profile
@softiconic
softiconic / custom.js
Last active December 2, 2023 18:34
Smart Preloader for WordPress
window.addEventListener('load', function(event) {
fadeAway();
function fadeAway() {
var delay = 1000; // Adjust the delay in milliseconds as needed
var duration = 500; // Adjust the duration in milliseconds as needed
// Check if jQuery is defined and if not, load it
if (typeof jQuery === 'undefined') {
var script = document.createElement('script');
@softiconic
softiconic / functions.php
Last active December 2, 2023 18:34
Convert WordPress URL/Slug from lowercase to uppercase.
//this for SLUG url lowercase to uppercase
add_filter( 'sanitize_title', 'wpse5029_sanitize_title_with_dashes', 10, 3 );
function wpse5029_sanitize_title_with_dashes($title, $raw_title, $context = 'display') {
$title = strip_tags( $raw_title );
// Preserve escaped octets.
$title = preg_replace( '|%([a-fA-F0-9][a-fA-F0-9])|', '---$1---', $title );
// Remove percent signs that are not part of an octet.
$title = str_replace( '%', '', $title );
// Restore octets.
@softiconic
softiconic / gist:147864cacc4f66762fef616770536d30
Last active December 2, 2023 18:35
JavaScript code snippet for displaying More/Less functionality.
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script type="text/javascript">
var $ = jQuery;
$(document).ready(function(){
$('.show-more').on('click', function(){
event.preventDefault()
$(this).toggleClass('content-hide')
$(this).closest('.profile-card').find('.show-less, .details-area').toggleClass('content-hide')
})
@softiconic
softiconic / gist:359c4b07e2bac114040455d0546cdd5c
Last active December 2, 2023 18:35
Hamburger menu with hover effect
<div class="scmenu-link-w act" id="sc81">
<div class="scmenu-link is--top"></div>
<div class="scmenu-link is--btm"></div>
</div>
div#elementor-popup-modal-373 {
z-index: 555!important;
}
@softiconic
softiconic / gist:866a0275432d823fca581dbeaec8f640
Last active December 2, 2023 18:36
Create a sticky header and a footer that moves from the bottom to the top using HTML, CSS, and JavaScript.
<a id="sctop">
<span> <svg enable-background="new 0 0 32 32" id="Слой_1" version="1.1" viewBox="0 0 32 32" xml:space="preserve" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><path clip-rule="evenodd" d="M26.704,10.192l-9.999-9.899 c-0.397-0.393-1.03-0.378-1.428,0l-9.999,9.9c-0.394,0.391-0.394,1.024,0,1.414c0.395,0.391,1.034,0.391,1.429,0l8.275-8.192V31 c0,0.552,0.452,1,1.01,1s1.01-0.448,1.01-1V3.414l8.275,8.192c0.394,0.391,1.034,0.391,1.428,0 C27.099,11.216,27.099,10.583,26.704,10.192z" fill="#121313" fill-rule="evenodd" id="Arrow_Upward"/><g/><g/><g/><g/><g/><g/></svg></span>
</a>
<script>
//this for header sticky
jQuery(document).ready(function($) {
$(window).on('scroll', function (){
var sticky = $('.scheader'),
scroll = $(window).scrollTop();
@softiconic
softiconic / gist:378ef276c1bb724f6ef632017abc6263
Last active December 2, 2023 18:37
Change background color on scroll
// Function to handle the intersection of the observed element
function handleIntersection(entries, observer) {
entries.forEach(entry => {
const targetSection = document.getElementById('tetosection'); // Replace 'my-section' with your section's ID
if (entry.target === targetSection) {
if (entry.isIntersecting) {
targetSection.classList.add('highlightsc');
} else {
targetSection.classList.remove('highlightsc');
@softiconic
softiconic / gist:f20c4cb67f978c06721a328f6b8135a1
Last active December 2, 2023 18:37
Apply a class to a specific section on a website as the user scrolls.
// Function to handle the intersection of the observed element
function handleIntersection(entries, observer) {
entries.forEach(entry => {
const targetSection = document.getElementById('tetosection'); // Replace 'tetosection' with your section's ID
if (entry.target === targetSection) {
if (entry.isIntersecting) {
targetSection.classList.add('highlightsc');
} else {
targetSection.classList.remove('highlightsc');
@softiconic
softiconic / gist:7230a5e599307365ff03a3f3baed9f47
Last active December 2, 2023 18:37
Animate the background of a button.
<button class="btn-l-r btn">Left to Right</button>
<button class="btn-r-l btn">Right to Left</button>
<button class="btn-t-b btn">Top to Bottom</button>
<button class="btn-b-t btn">Bottom to Top</button>
button {
display: inline-block;
@softiconic
softiconic / gist:7aa37bcde7f4d6755d3a44b54cfae27e
Last active December 2, 2023 18:38
Close an Elementor popup when a button or link is clicked.
jQuery(function($){
$(document).on('click','.elementor-location-popup a', function(event){
elementorProFrontend.modules.popup.closePopup( {}, event);
});
});
@softiconic
softiconic / gist:1b6b361760656dfcab937d3551f9cbae
Last active December 2, 2023 18:38
Create a loop moving up and down or left and right using CSS.
@-webkit-keyframes vertical-moveright{
0%{-webkit-transform:translateX(0);transform:translateX(0)}
100%{-webkit-transform:translateX(-100px);transform:translateX(-100px)}
}
@keyframes vertical-moveright{
0%{-webkit-transform:translateX(0);transform:translateX(0)}
100%{-webkit-transform:translateX(-100px);transform:translateX(-100px)}
}