zala
-
Posts
17 -
Joined
-
Last visited
Reputation Activity
-
zala got a reaction from MoonMama in How can I keep my scrolling marquee text on one line, and have it scroll without a pause?
Hi @bangank36 Thank you for giving it a shot.. For some reason it didn't help.
I found code elsewhere that finally got it working though. Here's the code that worked for me in case it helps anyone else:
In Code Block:
<div class="marquee"> <div class="track"> <h3> insert marquee text repeated 10-15 times here </h3> </div> </div> In Custom CSS:
// MARQUEE//.marquee { position: absolute; display: flex; animation: moveLeft 1200s linear infinite; }.track { white-space: nowrap; min-width: 100%; text-align: center; }section[id*="dte-weekend-adventures-full"] { overflow-x: hidden !important; overflow-y:hidden; min-height:initial !important;.Index-page-content { padding-top:30px; padding-bottom:30px; } }@keyframes moveLeft { from { transform: translateX(0%) } to { transform: translateX(-100%) } } -
zala reacted to creedon in Is there a way I can manually add a google map into my site?
CSS does not add structure to a site. It is for changing the style of elements.
Adding a map is adding structure so you need to use an embed code and/or Javascript, in a code block or other place in SS that accepts it.
-
zala got a reaction from EbonyW in How can I keep my scrolling marquee text on one line, and have it scroll without a pause?
Hi @bangank36 Thank you for giving it a shot.. For some reason it didn't help.
I found code elsewhere that finally got it working though. Here's the code that worked for me in case it helps anyone else:
In Code Block:
<div class="marquee"> <div class="track"> <h3> insert marquee text repeated 10-15 times here </h3> </div> </div> In Custom CSS:
// MARQUEE//.marquee { position: absolute; display: flex; animation: moveLeft 1200s linear infinite; }.track { white-space: nowrap; min-width: 100%; text-align: center; }section[id*="dte-weekend-adventures-full"] { overflow-x: hidden !important; overflow-y:hidden; min-height:initial !important;.Index-page-content { padding-top:30px; padding-bottom:30px; } }@keyframes moveLeft { from { transform: translateX(0%) } to { transform: translateX(-100%) } } -
zala reacted to tuanphan in Hiding additional images in product gallery
Add image 2, then add this to Design > Custom CSS
/* Hide bottom image */ .ProductItem-gallery-slides>div:nth-child(n+2) { display: none !important; }
-
zala reacted to tuanphan in Banner Image Won't Resize for Mobile View
Add to Home > Design > Custom CSS
@media screen and (max-width:767px) { body#collection-5eb3b0706fd71a32082ffc7e #page section:first-child { min-height: 30vh; height: 40vh; } }
-
zala reacted to tuanphan in Switching the order of blocks for mobile
Add to Settings > Advanced > Code Injection > Footer > Then save, reload & check your site on mobile.
If the code doesn't work properly, access Design > Site Styles > Disable Ajax Loading.
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script> <script> jQuery(document).ready(function($){ if (jQuery(window).width() < 640) { $('section#swimming-text-flex-split').insertBefore('section#swimming-banner-flex-split'); } }); </script>
-
zala reacted to Beyondspace in How can I keep my scrolling marquee text on one line, and have it scroll without a pause?
try if this help
<style> #dte-weekend-adventures .Index-page-content { padding-left: 0; padding-right: 0; } .marquee { width: 100%; margin: 0 auto; overflow: hidden; white-space: nowrap; margin-top: 17px; } .marquee-content { display: inline-block; margin-top: 5px; animation: marquee 15s linear infinite; } .item-collection-1 { position: relative; left: 0%; animation: swap 15s linear infinite; } @keyframes swap { 0%, 50% { left: 0%; } 50.01%, 100% { left: 100%; } } .marquee-content:hover { animation-play-state: paused } .item1 { display: inline-block; height: 70px; width: 140px; background: cyan; vertical-align: top; margin-left: 15px; } .item2 { display: inline-block; height: 70px; width: 100px; background: magenta; vertical-align: top; margin-left: 15px; line-height: 14px; } /* Transition */ @keyframes marquee { 0% { transform: translateX(0) } 100% { transform: translateX(-100%) } } </style> <div class="marquee"> <div class="marquee-content"> <span class="item-collection-1"> Roman roads and marshmallows roasted on fire pits. Fairy tales on Snowdonia mountain trails. Bracing dips in lakes that reset. The office grind forgotten; the city air vanished. </span> <span class="item-collection-2"> Roman roads and marshmallows roasted on fire pits. Fairy tales on Snowdonia mountain trails. Bracing dips in lakes that reset. The office grind forgotten; the city air vanished.</span> </div> </div>
-
zala reacted to creedon in Link image in Summary Block to Source URL, in new window
@zala
There is no place to put a redirect URL as this is not what the codes are designed to do. The codes do what the OP asked.
Did you read the URL included that explains what the targetAtttributeValue values mean?
Please start a new question describing what you want to achieve as what you want is different from what this thread is discussing.
-
zala got a reaction from Beyondspace in How can I keep my scrolling marquee text on one line, and have it scroll without a pause?
Site URL: https://www.downtoearthadventures.com/
Hi, I'm trying to get the scrolling marquee text to scroll continuously, without a pause and on one line. Any advice?
https://www.downtoearthadventures.com/
pw: downtoshirts
Examples:
https://gawoonchung.com/about
https://fourtwocreative.com/
Thank you!