Where communities thrive


  • Join over 1.5M+ people
  • Join over 100K+ communities
  • Free without limits
  • Create your own community
People
Repo info
Activity
  • Jan 31 05:16
    Jerit3787 commented #6679
  • Jan 31 05:15
    Jerit3787 commented #6679
  • Jan 31 05:14
    Jerit3787 commented #6679
  • Jan 31 05:14
    Jerit3787 commented #6679
  • Jan 30 19:39
    Canabale opened #6679
  • Jan 23 03:10
    swordbe opened #6678
  • Jan 20 10:56
    Jero786 commented #6464
  • Jan 19 09:16
    SuhwanCha closed #6194
  • Jan 04 23:25
    afarago closed #6677
  • Jan 04 23:25
    afarago commented #6677
  • Jan 04 23:18
    afarago commented #6677
  • Jan 04 00:43
    MergeCommits commented #4027
  • Jan 01 17:18

    acburst on gh-pages

    Patreon Jan (compare)

  • Dec 27 2022 17:55
    pajod closed #3528
  • Dec 26 2022 20:25
    rpalacio86 commented #5803
  • Dec 26 2022 20:25
    rpalacio86 commented #5803
  • Dec 26 2022 20:22
    rpalacio86 commented #5803
  • Dec 24 2022 13:06
    Jerit3787 commented #6677
  • Dec 19 2022 11:16
    chrisAXZA commented #3844
  • Dec 18 2022 20:45
    DanielRuf commented #3844
nikith14
@nikith14
image.png
Sean Doherty
@doughballs
@nikith14 that’s the structure of the dropdown, no the select. Look below this for the original select that you used. That’s what you need to update using JavaScript/jQuery
Elias
@eliasnemr
Hey, I have a quick question - how come my form select (which I put in a <li> tag) is being overlay-ed by the parenting-div.. how do i overcome that? I want the select window to be appended to the body instead
Sean Doherty
@doughballs
@eliasnemr we'd need to see this...
Elias
@eliasnemr
Screenshot 2020-10-05 at 17.22.59.png
Screenshot 2020-10-05 at 17.23.06.png
Sean Doherty
@doughballs
@doughballs do you mean you'd like the dropdown to appear below the trigger, rather than cover it?
Elias
@eliasnemr
Yes
Sean Doherty
@doughballs
when you initialise the select, pass dropdownOptions = {coverTrigger: false}

So:

M.FormSelect.init(elems, { dropdownOptions = {coverTrigger: false} })

Elias
@eliasnemr
Great, thanks
Sean Doherty
@doughballs
@eliasnemr let me know if it doesn't work, that was off the top of my head (untested) but should be right...
Manojkumar Palanisamy
@SmartManoj

```<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/css/materialize.min.css">

<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/js/materialize.min.js"></script>

<h4 style="text-align: center">Hello Rooster 🐔</h4>

<div class="row">
<div class="input-field col s6">
<input id="fname" type="text" class="validate">
<label for='name'>Name</label>
</div>
</div>

<div class="row">
<div class="col s6">
<a onclick="M.toast({html: fname})" class="btn">Toast!</a>
</div>
</div>```

When clicking toast, the input field is moving

Elias
@eliasnemr
It wasn't what I was looking for, but I got it working by setting overflow: unset on the <ul>
hcrev
@hcrev
Heya, is it possible to pass options or select to the select form (and select an option) via js? Found dropdownOptions in the Select docu but does not seem to specify the syntax for passing in data.
M.FormSelect.init(elem, {
          'dropdownOptions':{
               'data':[
                   {'option': 'Option 1', 'selected': true},
                   {'option': 'Option 2}
               ]
          }
 });
hcrev
@hcrev
just in theory.. but looking for something like this.
Sean Doherty
@doughballs
@hcrev the init is something that runs on the select, and turns the options into a dropdown. So as it stands you can set options this way. You could write a mini function that populates the select, and then run the init.
*’can’t set options this way’
hcrev
@hcrev
@doughballs That sounds good I'll do that instead, thanks 🙌
Julià
@pujoljulia
Does someone know how to disable a float button? Seems that by adding the disabled class it doe snot work
Did someone encounter that situation before?
Sean Doherty
@doughballs

@pujoljulia do you mean a FAB? It does work, i just added the class in the inspector and it greyed out.

https://materializecss.com/buttons.html#floating

<a class="btn-floating waves-effect waves-light btn-large red disabled"><i class="material-icons">add</i></a>
Julià
@pujoljulia
… don’t know why is not working on my app - Thanks @doughballs, now I know I am doing something wrong
computerwiz12890
@computerwiz12890
@doughballs So back to this issue...
image.png
image.png
Just had someone report to me it is happening again, so I inspected the elements.
Everything appeared normal. In fact, when I turned off a styling (like the font-size) and then turned it back on, the icons appeared just fine.
Could this be because I have the link to the plugins at the TOP of my page, instead of at the BOTTOM, like most people tend to do? I prefer my page to look like it's delaying, but then load 100% the way it will look...
Bikash Sahu
@bikash44
@doughballs I want to add n number of image to Carousel.but need to display on 5 image at a time and when i scroll slider all image will come one by one. is it possibe in https://materializecss.com/carousel.html this slider ?
Sean Doherty
@doughballs
@computerwiz12890 that sounds like it could be an issue. As a hard rule - styles in the head, JS just before closing body tag.
@bikash44 that is the default setting - show 5, scroll 1. Is that not what you’re looking for? See the options field underneath for customisation options.
WAPEETY
@WAPEETY
hi
I would like to make a portfolio theme, ideas?
computerwiz12890
@computerwiz12890
Thanks for the "hard rule" @doughballs, I will give that a shot.
Sean Doherty
@doughballs
@tuffant21 or anyone else - have you got a fix for preventing dropdowns from closing when the tab key is pressed?
Anthony House
@tuffant21
Nice 👍
I actually just had a very similar problem with a button being over another clickable card. Had to do stopPropagation
Marten
@martendegroot
I was wondering; in my browser https://material-ui.com/ switched to a dark mode version, but on my local version it didn't. Anyone an idea A) where I could find this feature and otherwise B) how I could activate this dark mode manually?
Sean Doherty
@doughballs
@martendegroot that site isn’t connected to this Gitter...
Chessking22
@Chessking22
@dogfalo or anyone else, as a User Experience Designer using Sketch, I'm trying to locate a Materialize sketch template to create some mock-ups. Does one currently exist?
JorgeEDR
@JorgeEDR
Hi, somebody can help me please? when the user do scroll, i want the navbar change color, but only when it scrolls, ¿ how i can do that in materialize? tnxs!
Michael Murphy
@murchu27
Hey all, could I get some help with a navbar (on v0.100.2)? Is there a native way to get it to close when you click somewhere else on the page? The ones on the documentation does this, both the demo navbar and the actual website's navbar (only when using a smaller screen). Is this built into materialize or would this need to be coded up?
Michael Murphy
@murchu27
Those two sidenavs also dim the rest of the screen while they are open - is this an option that can be enabled when initializing the sidenav, or does it have to be added in manually?
Sean Doherty
@doughballs
@murchu27 do you need to use 1.0.2?
@JorgeEDR there is no in built Materialize nav scroll function, but it’s very easy to implement:
https://stackoverflow.com/questions/23706003/changing-nav-bar-color-after-scrolling
Michael Murphy
@murchu27
@doughballs Not desperately, that's just what we have at the moment and it would be less than ideal to upgrade right now
Majd Haj Yehia - BestDr
@BestDr
guys, when I create a textarea dynamically how can I get the label to shift (I also have a placeholder for the textarea, so the label should go up), and when I do that I noticed the that height isn't the same before & after you type in those dynamically created textareas, any suggestions?