Advertisement:

Author Topic: OSCLASSWIZARD: FREEZE / FROZEN HEADER WHILE SCROLLING  (Read 4387 times)

Darwazo

  • Full Member
  • ***
  • Posts: 112
Re: OSCLASSWIZARD: FREEZE / FROZEN HEADER WHILE SCROLLING
« Reply #15 on: September 27, 2017, 12:06:44 am »
you are right . I didn't make any change on website yet as I am looking for this thought to get implemented( if possible)
I am doing practice on localhost.
Its okay thanks

Give a try to this site : www.zameen.com for understanding purpose.

marius-ciclistu

  • issues
  • Hero Member
  • *
  • Posts: 1623
  • "BE GRATEFUL TO THOSE THAT SUPPORTED YOU"
Re: OSCLASSWIZARD: FREEZE / FROZEN HEADER WHILE SCROLLING
« Reply #16 on: September 27, 2017, 12:12:15 am »
Try the code I wrote in the previous reply.

Darwazo

  • Full Member
  • ***
  • Posts: 112
Re: OSCLASSWIZARD: FREEZE / FROZEN HEADER WHILE SCROLLING
« Reply #17 on: September 27, 2017, 12:25:11 am »
I mentioned earlier your code is working and header is frozen (without MAIN SEARCH).

I want that MAIN SEARCH To Get FROZEN only - which searching.

Code result is attached.

Thanks

marius-ciclistu

  • issues
  • Hero Member
  • *
  • Posts: 1623
  • "BE GRATEFUL TO THOSE THAT SUPPORTED YOU"
Re: OSCLASSWIZARD: FREEZE / FROZEN HEADER WHILE SCROLLING
« Reply #18 on: September 27, 2017, 12:27:19 am »
Aaaa. You are talking about the sidebar search, not the header one.

Edit. I gues it's easier/better to keep the top search frozen and visible on all pages instead of frozing the sidebar's one.
« Last Edit: September 27, 2017, 12:29:49 am by marius-ciclistu »

Darwazo

  • Full Member
  • ***
  • Posts: 112
Re: OSCLASSWIZARD: FREEZE / FROZEN HEADER WHILE SCROLLING
« Reply #19 on: September 27, 2017, 12:48:46 am »
I am also saying same !! i want  ONLY "top search frozen" - which I achieved.
Now two issues :
1-Alignement below header logo
2- After scrolling down : Top Search should get frozen
3- if I search IPHONE - and come down at bottom of listing , TOP SEARCH should appear frozen.

thanks :)

marius-ciclistu

  • issues
  • Hero Member
  • *
  • Posts: 1623
  • "BE GRATEFUL TO THOSE THAT SUPPORTED YOU"
Re: OSCLASSWIZARD: FREEZE / FROZEN HEADER WHILE SCROLLING
« Reply #20 on: September 27, 2017, 12:57:33 am »
The code I wrote seems to work ok on home page on your 'pink' site without those issues. I don't understand the issues on your local site.

marius-ciclistu

  • issues
  • Hero Member
  • *
  • Posts: 1623
  • "BE GRATEFUL TO THOSE THAT SUPPORTED YOU"
Re: OSCLASSWIZARD: FREEZE / FROZEN HEADER WHILE SCROLLING
« Reply #21 on: September 27, 2017, 01:12:24 am »
Look at the attachment.

Darwazo

  • Full Member
  • ***
  • Posts: 112
Re: OSCLASSWIZARD: FREEZE / FROZEN HEADER WHILE SCROLLING
« Reply #22 on: September 27, 2017, 03:19:25 am »
Thank you for reply marius.....

Its only working for main page.

I am sorry - I guess I am unable to communicate you properly.

Pls. see attached file again to understand Question.

Thank you for your time.

Liath

  • issues
  • Hero Member
  • *
  • Posts: 1346
  • </html> the end is always near
Re: OSCLASSWIZARD: FREEZE / FROZEN HEADER WHILE SCROLLING
« Reply #23 on: September 27, 2017, 05:57:55 am »
depending to your theme on darwazo.com and this code provided here, maybe you need only to


add this to your javascript file
Code: [Select]
$(window).scroll(function() {
    if ($(this).scrollTop() > 139) {
        $('#form_vh_map').addClass('sticky');
    } else {
        $('#form_vh_map').removeClass('sticky');
    }
});


and this to your stylesheet
Code: [Select]
#header .banner_none.sticky {
    position:fixed;
    top:0;
    z-index:999;
}
« Last Edit: September 28, 2017, 09:41:09 pm by Liath »

marius-ciclistu

  • issues
  • Hero Member
  • *
  • Posts: 1623
  • "BE GRATEFUL TO THOSE THAT SUPPORTED YOU"
Re: OSCLASSWIZARD: FREEZE / FROZEN HEADER WHILE SCROLLING
« Reply #24 on: September 27, 2017, 11:57:32 am »
In your theme the searchbar is not visible in all pages. You must make it visible on all pages first, then try to freeze it. Look in your header.php for some conditions like if( !osc_is_static_page() || ...)

Darwazo

  • Full Member
  • ***
  • Posts: 112
Re: OSCLASSWIZARD: FREEZE / FROZEN HEADER WHILE SCROLLING
« Reply #25 on: September 28, 2017, 12:47:06 am »
@Liath - Thank u the code !!
I tried but didnt any result...may be bcz im baby coder :(...
I used your code in Javascipt code  in Main.php - at header & Positon fixed code in CSS.....

@Marius ...thank you for the code ....
I tried but I didn't find :(

I have learnt how to fix side searchbar but little alignment issue.

I will get live help from frined tomorrow and lets see and will update you.

Thank you again for your time


Liath

  • issues
  • Hero Member
  • *
  • Posts: 1346
  • </html> the end is always near
Re: OSCLASSWIZARD: FREEZE / FROZEN HEADER WHILE SCROLLING
« Reply #26 on: September 28, 2017, 07:33:00 pm »
try this code, to look if it triggers or not

Code: [Select]
$(window).scroll(function() {
    if ($(this).scrollTop() > 139) {
        $('#form_vh_map').addClass('sticky');
        console.log('Add class sticky');
    } else {
        $('#form_vh_map').removeClass('sticky');
        console.log('Remove class sticky');    }
});


now, if you scroll around on your page, you should see some hints in your browser console, if this hints appears, look, if class sticky is set to the right container


then, it s important to use the css class i have posted earlier, because this is set through this javascript
Code: [Select]

#header .banner_none.sticky {
    position:fixed;
    top:0;
    z-index:999;
}






edit:
maybe this demo is helpful to you: https://jsfiddle.net/Lrof7n2m/
« Last Edit: September 28, 2017, 09:42:22 pm by Liath »

Darwazo

  • Full Member
  • ***
  • Posts: 112
Re: OSCLASSWIZARD: FREEZE / FROZEN HEADER WHILE SCROLLING
« Reply #27 on: September 29, 2017, 12:58:55 am »
Thank you very much Liath for your time and code Worked perfectly :)

I inserted your javascript code in header.php and works out perfectly.


is it possible , if I CLICK "SEARCH" - Search Result page should also have above fixed search bar at the top?
Sorry for trouble ....just a vision - I am sharing with you









Liath

  • issues
  • Hero Member
  • *
  • Posts: 1346
  • </html> the end is always near
Re: OSCLASSWIZARD: FREEZE / FROZEN HEADER WHILE SCROLLING
« Reply #28 on: September 29, 2017, 01:08:35 am »

yes of course it is possible, but marius-cliclistu already gave you the correct answer.
In your theme the searchbar is not visible in all pages. You must make it visible on all pages first, then try to freeze it. Look in your header.php for some conditions like if( !osc_is_static_page() || ...)


you need to modify your theme to have a searchbar on all pages


search for this in header.php and comment it out
Code: [Select]
if( osc_is_home_page() ) {

after the block for the search form you have this to comment out
Code: [Select]
<?php ?>

marius-ciclistu

  • issues
  • Hero Member
  • *
  • Posts: 1623
  • "BE GRATEFUL TO THOSE THAT SUPPORTED YOU"
Re: OSCLASSWIZARD: FREEZE / FROZEN HEADER WHILE SCROLLING
« Reply #29 on: September 29, 2017, 01:19:01 am »
Liath, I'm curious.
If there will be 2 searches in one page, the functionality will not suffer?
I mean main search bar and sidebar search, with 2 submit buttons.