Thank You Marius - Thats Great!

Hi Marius

I began by adding the above code

CSS

.red {
background: #f1f1f1 !important;
}
.red:hover {
background-color: #ff1900 !important;
}
.blue {
background: #f1f1f1 !important;
}
.blue:hover {
background-color: #ff1900 !important;
}

JQUERY

<script>
window.laytheme.on("newpage", function(layoutObj, type, obj){

jQuery(document).on("hover", ".thumb",
function(event) {

jQuery("body").removeClass("red");
jQuery("body").removeClass("blue");
jQuery("body").removeClass("yellow");

var category = jQuery(this).attr("data-catid");

if (category == 6) {
  jQuery("body").addClass("red");
  }

if (category == 3) {
	jQuery("body").addClass("blue");
  }
if (category == 5) {
	jQuery("body").addClass("yellow");
  }

}

);

});
</script>

as I said above this worked all be it the hover off only worked once the mouse had left the window not the thumbnail

I did attempt an example with mouseenter and mouseout in JSFIDDLE -

https://jsfiddle.net/Toby05/3yjw0dpk/15/#&togetherjs=9ISpwkHzla

HTML

<div class="box" data-catid="1">data-catid=1</div>

CSS

.box

JQUERY

$(document).ready(function(){
$(".box").mouseenter(function(){
$(this).css("background-color", "#ff1900");
});
$(".box").mouseleave(function(){
$(this).css("background-color", "#f1f1f1");
});
});

but have been unsuccessful in applying more than one colour / category and adding to lay theme.

Cheers
Toby

Hi Marius

Thanks for the code.

I've added this code to my CSS

.red {
background: #f1f1f1 !important;
}
.red:hover {
background-color: #ff1900 !important;
}

Which works but only when the pointer leaves the actual window and not when it leaves the thumbnails

Any ideas?

I'd also like this to only effect the overview page - I did a search on the forum and found this code

if(obj.slug == "frontpage”){

changing “frontpage to match my slug and applied it like they said to your example but it didn’t work.

Cheers
Toby

Cheers
Toby

Hi Armin / Marius

I have given my thumbnails a specific colour on rollover - however would it be possible to apply that specific colour to the body background of website ( not thumbnail) on hover / rollover)?

I'd be looking to do this on just one specific page - "Overview " where all my categories are together.

www.tobyneilan.com

Cheers
Toby

Solved it - thanks for the help.

Toby

@arminunruh

Thanks Armin - have it working.

btw I did read the link but i'm the daft student who's changes the navbar to static and fails!!

Thanks again
Toby

Hi

Is there a way to stop mobile rotation / lock screen?

Cheers
Toby

Hi Armin

Ok I've got a working site - one problem I have is 'works on paper' is missing my logo in the footer and when I try and edit the page and click update it loads the live page without the update being complete.?

Cheers
Toby

EDIT - laid out that particular page again and everything is now working as it should..

Ah! the dreaded z- index
Thanks Richard

Toby

Hi @Armin-Unruh

I've just updated the theme to 2.8.9 and have noticed my site title image has disappeared on the mobile

I have a iPhone Xs.

www.tobyneilan.com

Cheers
Toby

Great - Thanks Armin

Just updated to latest lay theme version and have now noticed the activated scroll element on a row that has text allocated, is scrolling up multiply times at great speed too.

I'm viewing this on an apple iphone14 Pro

www.tobyneilan.com

@arminunruh

Thanks Armin - have it working.

btw I did read the link but i'm the daft student who's changes the navbar to static and fails!!

Thanks again
Toby

@arminunruh

Hi Armin

I Could only find these posts

http://laythemeforum.com:4567/topic/7217/category-filter-position?_=1680510893228

http://laythemeforum.com:4567/topic/6399/category-filter-position/4?_=1680510893231

but they don't help with positioning of the categories text above the navbar.

I don't understand why a fixed .lay-hr at a z-index at 20

can appear above the navbar

but a fixed .lay-thumbnailgrid-filter at a z-index at 99 is still hidden below said navbar!?

Cheers
Toby

Any help please?

I'd like the thumbnail grid images to go behind the navbar and the categories to remain above the navbar.

As soon as I allocate a z-index higher than 1 to the navbar it hides the thumbnail grid and categories despite giving the thumbnail grid -filter a index of 99

Hi

I've added a fixed header to one of my pages and have the thumbnailgrid scrolling behind it. but I'd like the categories to remain fixed not scroll up and be in front of the fixed header.

The code on said page so far is this -

.lay-thumbnailgrid-filter {
position:fixed;
top:0;
left:12.1%;
margin-top:90px;
margin-right:20px;
z-index:99;
}

body.slug-project_test .lay-hr {
background-color: #d3d3c3;
position:fixed;
z-index:99;
}

body.slug-project_test .navbar{
background-color: #f1f1f1 !important;
height:17.5%;
}

Cheers
Toby

Hi

Is there a way to stop mobile rotation / lock screen?

Cheers
Toby

@arminunruh

ah ok thanks Armin.

@alasdair17 said in Navbar:

body.slug-about .navbar{
background-color: #ffffff !important;
}
body.slug-about .navbar{
position: initial !important; !important;
}

Great!
Thanks Alistair

I have my menu bar set to move away when scrolling down - however I'm looking to fix it on one specific page and change the navbar colour on said specific page.

I have seen on a previous thread this code was suggested for a fixed navbar

.navbar{
position:initial !important;
}

I've also applied this code to try and change colour a specific nav bar

body[data-type="page"][data-id="990"] .navbar{
background-color: #ffffff !important;
}

I also tried to combine the two

body[data-type="page"][data-id="990"] .navbar{
position:initial !important;
background-color: #ffffff !important;
}

but unfortunately no joy - can you help?

Cheers
Toby