Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search

casson

Member
  • Content Count

    12
  • Joined

  • Last visited

Recent Profile Visitors

The recent visitors block is disabled and is not being shown to other users.

  1. Hi, I've put a Slideshow Gallery at the top of an Index Page in the Brine template. It has three images that transition. By default when the mouse hovers over an image the slideshow pauses and you cannot prevent this automatic pausing without a code injection. I would like the slideshow to continue on mouseover however I still need the website visitor to be able to press a gallery dot/arrow indicator or press a 'Call to Action' link in the image content body text. How can this be achieved? The code below prevents the index slideshow pausing on mouseover but it also switches off all mouse pointer events... /* Index Gallery Slideshow - prevent pause on hover */ .tweak-index-gallery-layout-slideshow .Index-gallery-wrapper { pointer-events: none!important; } .tweak-index-gallery-layout-slideshow .Index-gallery-wrapper .Index-gallery-control { pointer-events: auto; }
  2. Hi, The fade transition time between images in a 7.1 Gallery Section Slideshow is too abrupt. SS cannot assist as it requires code injection. Does anyone know of some code that will slow the fade down so there is a slow cross-fade effect between images? The code below works in 7.0 (in the page's CSS) but it doesn't work in 7.1 (Gallery Section inserted into a Blank Page). Many thanks. <style> .slide { visibility: visible !important; -webkit-transition: opacity 2s ease-in-out; -ms-transition: opacity 2s ease-in-out; -moz-transition: opacity 2s ease-in-out; -o-transition: opacity 2s ease-in-out; transition: opacity 2s ease-in-out; } </style>
  3. Hi, can you post the code that keeps your desktop text static...
  4. Hi, I am using Squarespace 7.1. At the top of my home page I want to have three full bleed banner style pics transitioning as a fading slideshow. I am looking to achieve the following: - I would like the text headings that I will have overlayed on top of the images to remain static during the image transitions - I think these need to be a separate text blocks so they're not affected by the image fading - I would like the slide fading to transition slowly (not abruptly like the current ‘Gallery’ fade setting) How can this be achieved? Any help much appreciated
  5. ok, understood, the landing page which I have just started working on is at... https://chicory-gar-gmkw.squarespace.com/home The code block in question is the image 'Gothic Ambience' I'll send you the password directly. Thanks for your help.
  6. Hi and thanks for responding. I'm using 7.1 for reference and the code block is on the homepage. I can't really give out a password at the moment because of the site's content but can confirm what I have at the moment regarding code. Hopefully you can advise from this? I have got this far from reading forums and I'm not (as you can probably tell) a developer! The HTML in the code block is as follows: <a href="https://chicory-gar-gmkw.squarespace.com/shop"> <div id="cf"> <img class="bottom" src="https://static1.squarespace.com/static/5dc7fcb97665c170c504ac05/t/5dc80acfb9580a7364fa8ac2/1573391056583/Gothic+Shop.jpg" /> <img class="top" src="https://static1.squarespace.com/static/5dc7fcb97665c170c504ac05/t/5dc80abe394ef27dc9a9523b/1573391039411/Gothic+Ambience.jpg" /> </div> </a> The CSS in Design > Custom CSS is as below. The last section is my attempt to try and get the code block to full width but it's not playing. #cf { position:relative; } #cf img { position:absolute; left:0; -webkit-transition: opacity 0.5s ease-in-out; -moz-transition: opacity 0.5s ease-in-out; -o-transition: opacity 0.5s ease-in-out; transition: opacity 0.5s ease-in-out; } #cf img.top:hover { opacity:0; } #block-yui_3_17_2_1_1573563399764_11327 { max-width: 100% !important; padding-left: 0 !important; padding-right: 0 !important; padding-top: 0 !important; padding-bottom: 0 !important; //margin-left: 0px; // margin-right: 0px; }
  7. Hi, Is there some code that will make a 'code block' fill the full bleed of the screen on the homepage? The code block currently retrieves and displays two images (one on hover only) but the images don't spread full bleed as I can only manually drag the code block out to a certain width. I'd need a 'responsive' solution to perform properly across all devices (smartphone etc.). Any help would be much appreciated.
  8. Hi,I'm setiing up a website in 7.1 and would like to have three full width banner images on my homepage transitioning. The images must fade and they must FADE SLOWLY. Currently when I set the transition to autoplay and fade (in a slideshow gallery) the movment between images is too abrupt and doesn't really fade at all. How can this be achieved using code? It's 7.1 and it's the homepage's banner pics that I'm looking at (or a slideshow gallery as banner pics I guess?). I can see from past forums online (pre SS 7.1) that people have used code to slow the fading down between images but the solutions are not geared towards a homepage and I can't see where I can inject code to a banner pic - any help much appreciated, thanks.
×
×
  • Create New...