-
Posts
25 -
Joined
-
Last visited
Personal Information
- Website
-
Location
Deutschland
Recent Profile Visitors
The recent visitors block is disabled and is not being shown to other users.
SabineM's Achievements
-
SabineM reacted to a post in a topic: Simple. Horizontal. Scroll
-
SabineM reacted to a post in a topic: product images not showing in order
-
I have exactly the same Problem on a clients site. If there is a solution - please let me know. 🙏 Website link: https://www.weingut-diehl.com/kein-wein-products
-
How to change a summary block thumbnail image on rollover?
SabineM replied to TMedia's topic in Customize with code
@tuanphan Thank you very much for your advice and the link.- 42 replies
-
SabineM reacted to a post in a topic: How to change a summary block thumbnail image on rollover?
-
SabineM started following Simple. Horizontal. Scroll , How to change a summary block thumbnail image on rollover? , HELP- Advanced Coding Assistance and 3 others
-
How to change a summary block thumbnail image on rollover?
SabineM replied to TMedia's topic in Customize with code
@tuanphan Hi, Tuan, thanks a bunch for the code snippet! It is exactly what I am looking for - tried it right now - but it doesn't work in a shop summery... it makes the first image invisible but the second isn't showing up - there is only a white space the... This is the website and page where I would like to us it: https://www.weingut-diehl.com/weinindex/#tasting-box-wahl In the "shop summery/preview" Squarespace does it as a standard feature - it would be perfect to have the same in this first shop/product overview... https://weingut-diehl.squarespace.com/tasting-box do you have any idea? Thanks in advance! Sabine- 42 replies
-
@ccrews @AdrienneN @meocoli Hi everybody, I am quite new in CSS and have only some basic knowledge and experience 😉 but anyway I tried to find out how this could work...because I wanted it a lot ! By a lot of trial & error & time. - and not sure if the code is really a solution without mistakes - it works! Simple gallery: in Brine template and I used an index gallery with: layout slideshow, and the fixed height at 108vh. with 6 slides. #horizontal-gallery { width:600vw; margin-top:-5vw; margin-bottom:-5vw; overflow-x:scroll; overflow-y:hidden!important; position:absolut; } #horizontal-gallery .Index-gallery-item-image { width:100vw!important; max-height:105vh; margin-top:-0vw; padding-bottom:3.6vw; } #horizontal-gallery{ article:nth-of-type(1){ opacity:1.0; left:0vw!important; right:0vw; .Index-gallery-item-content {margin-left:-500vw!important; }} article:nth-of-type(2){ width:100vw!important; left:0vw!important; opacity:1.0; } article:nth-of-type(3){ width:100vw!important; left:100vw; } article:nth-of-type(4){ width:100vw!important; left:200vw; } article:nth-of-type(5){ left:-200vw!important; .Index-gallery-item-content {margin-left:-500vw!important; }} article:nth-of-type(6){ left:-100vw!important; .Index-gallery-item-content {margin-left:-500vw!important; }} } .Index-gallery-item-content-body p:nth-of-type(1){font-size:0.5em!important; color:#ccaa78; margin-top:-4vw!important; } A bit more complex is this version - but it's an entire index that works like this and so you are free with the content for each page. The scrolling go up and down while the window is horizontal - I love this !! 🙂Sometimes the browser blocks the scrolling until you make the window a tiny bit larger or smaller - do not know why.... #collection-5f749ce77757eb5a41feb591{ .Content-outer { -webkit-overflow-scrolling: touch!important; overflow-scrolling: touch!important; overflow-x:hiddden; overflow-y:scroll!important; -webkit-overflow-y:scroll!important; transform: rotate(270deg) translateX(-100%); transform-origin: top left; top:0!important; position:absolute; width:100vh; height:100vw; top: 0vw; bottom:0vw; right: 0vw; left: 0vw; }} //turns/header/images #page-five, #page-four, #page-three, #page-two,.IndexFirstSectionHeight{ transform: rotate(90deg) translateY(-100vh)!important; transform-origin: top left!important; } //index first section #page-two{ width:120vw; margin-top:4vw; margin-bottom:40vw; } #page-two{ .Index-page-content.sqs-alternate-block-style-container{ margin-bottom:10vw; margin-left:-5%; }} #page-three {.Index-page-content{ position:absolute; margin-top:20vw!important; display:flex; flex-direction:column; align-items: center; justify-content:center!important; display: flex; flex-wrap: wrap; }} #page-five, #page-four, #page-three { width:100vw; } #page-four{margin-left:0vw; width:100vw; margin-top:45vw; //is left: margin-bottom:45vw; //is right: #block-yui_3_17_2_1_1601546029396_3755{ width:40%; margin-left:30%; } #block-b1eda712c8f4ae9551f1{ width:100%; padding:0; } } .Index-nav{ display:none!important;} .Index-page-scroll-indicator{ transform: rotate(-90deg) translateY(0px)!important; margin-bottom:4vw; margin-left:-15vw!important; } To all of you much more experienced guys - if you see some mistakes - please let me know. here is the demo site: https://my-personal-test.squarespace.com/ the pw is: luck
-
Nir reacted to a post in a topic: Main Homepage image - white appears gray
-
SabineM reacted to a post in a topic: How to Create Full Page Sections / Single Page Website with Locked Scrolling / CSS Snapping
-
Main Homepage image - white appears gray
SabineM replied to Sinclair's topic in Site Design & Styles
As I made some website for clients - would recommend you to use the Brine template or one of this family ( see squarespace help - Brine) - it is the best and has the most features and used by the most professional designers. -
Main Homepage image - white appears gray
SabineM replied to Sinclair's topic in Site Design & Styles
-
Main Homepage image - white appears gray
SabineM replied to Sinclair's topic in Site Design & Styles
what template do you have? -
Main Homepage image - white appears gray
SabineM replied to Sinclair's topic in Site Design & Styles
(sorry for mistakes - I am German....) do you have an overlay color, perhaps? See in your > site styles > style editor....