Recent
Categories
View Replies (5)

New Module position in header Hannah Template

  1. Issue
0
Votes
Undo
  1. Mol4
    Mol4
  2. Sherlock Holmes The Voice
  3. Commercial Templates
  4. Wednesday, 16 January 2019
  5.  Subscribe via email
Hello Ciarán,
On my clients website I've add an extra position in the header of the template (as described in your Tutorials)
This position is for two language flags for translations in English and German.
Since the translation is only for one page (each) I 've decide not to use the language extension but to use the flags as a link to the page with the translation on it.
As you can see this works fine.
But what I like to know is how to 'scale' the flags the same way as the logo and mainmenu does when scrolling down the page.
For now the flags stay in position.
Thanks!
Responses (5)
ciaran
ciaran
Love Fool Sherlock Holmes The Voice
Notable Answerer Notable Answerer
Accepted Answer Pending Moderation
0
Votes
Undo
Hello

Because your module is absolute positioned it is not possible to scale on screen size. Would repositioning the module be a suitable solution? And if so where would you like it repositioned to?

Ciaran
  1. more than a month ago
  2. Commercial Templates
  3. # 1
Mol4
Mol4
Sherlock Holmes The Voice
Accepted Answer Pending Moderation
0
Votes
Undo
Hello Ciarán,
Repositioning is maybe a solution. It only have to go about 20px up.
Thanks!
  1. more than a month ago
  2. Commercial Templates
  3. # 2
ciaran
ciaran
Love Fool Sherlock Holmes The Voice
Notable Answerer Notable Answerer
Accepted Answer Pending Moderation
0
Votes
Undo
Hello

To amend you can add the following to the Custom CSS field of your templates parameters (Extensions -> Templates -> [YourTemplateStyle] -> Custom CSS)....

Edit to taste...

@media only screen and (max-width: 440px) {

#newmodule {

    top: 0px;

}}


Ciaran
  1. more than a month ago
  2. Commercial Templates
  3. # 3
Mol4
Mol4
Sherlock Holmes The Voice
Accepted Answer Pending Moderation
0
Votes
Undo
Sorry Ciarán, but this is not what I mean. I think I didn't explain it right. On mobile the flags are just fine :-)
But on desktop they stick to their position were the logo and navigation go up when scrolling the page.
I thought the repositioning was meant for this (on desktop). But probably this is not possible so I leave it as it is.
Thanks again for your time!
  1. more than a month ago
  2. Commercial Templates
  3. # 4
ciaran
ciaran
Love Fool Sherlock Holmes The Voice
Notable Answerer Notable Answerer
Accepted Answer Pending Moderation
0
Votes
Undo
If you wish you could try something with the following. The first rule is before scroll and the second is after (edit to taste)..

#newmodule {

	top: 34px;

}

.is-sticky #newmodule {

    top: 20px;

}


Ciaran
  1. more than a month ago
  2. Commercial Templates
  3. # 5
  • Page :
  • 1


There are no replies made for this post yet.
Be one of the first to reply to this post!

Site Links

Recommended

Join Our Newsletter

* indicates required
We respect your privacy and do not tolerate spam and will never sell, rent, lease or give away your information (name, email, number, etc.) to any third party. Nor will we send you unsolicited email.
Joomla51 - Mullaghmore, Co. Sligo, Ireland
Joomla51.com is not affiliated with or endorsed by the Joomla! Project or Open Source Matters.
The Joomla! name and logo is used under a limited license granted by
Open Source Matters the trademark holder in the United States and other countries.

We use cookies on our website. Some of them are essential for the operation of the site, while others help us to improve this site and the user experience (tracking cookies). You can decide for yourself whether you want to allow cookies or not. Please note that if you reject them, you may not be able to use all the functionalities of the site.

Ok