0

I wanted to make dropdown menu and i did actually made it, but now i have one annoying problem. I got the blank div of reactJS component when my menu is not here.

normal menu

blank div in the back

So, here is the code behind this

@Users = React.createClass
 handleEnter: (e) ->
   $('.users').animate({top: '+=250px'});
 handleLeave: (e) ->
   $('.users').animate({top: '-=250px'});
 render: ->
  React.DOM.div
   onMouseEnter: @handleEnter
   onMouseLeave: @handleLeave
   className: 'users'
   React.DOM.h1
    className: 'h1'
    "Log In!"
     React.createElement SessionForm
   React.DOM.h1
    className: 'h1'
    "Sign up!"
     React.createElement UserForm
.users {
 padding-bottom: 40px;
  text-align: center;
  background-color: #f3f3f3;
  display: flex;
  position:  relative;
  bottom: 250px;
  /*-moz-box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3);*/
  /*-webkit-box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3);*/
  box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.4);
}

.users > .h1 {
 flex: 1;
}

.users > .h2 {
 flex: 1;
}
<%= react_component 'Users', {} %>
<%= react_component 'Tasks', { data: @tasks } %>
sheff3rd
  • 63
  • 7

0 Answers0