title: react show button on mouse enter
body: <p>I have a react component which hold method like:</p>
  
  <pre><code>mouseEnter(){
      console.log("this is mouse enter")
  }
  
  render(){
      var album_list;
      const {albums} = this.props
      if(albums.user_info){
          album_list = albums.user_info.albums.data.filter(album =&gt; album.photos).map((album =&gt; {
              return
                  &lt;div className={"col-sm-3"} key={album.id}     onMouseEnter={this.mouseEnter}&gt;
                      &lt;div className={(this.state.id === album.id) ? 'panel panel-default active-album' : 'panel panel-default'} key={album.id} onClick={this.handleClick.bind(this, album.id)}&gt;
                          &lt;div className={"panel-heading"}&gt;{ album.name }&lt;/div&gt;
                          &lt;div className={"panel-body"}&gt;
                              &lt;img className={"img-responsive center-block"} src={album.photos.data[0].source} /&gt;
                          &lt;/div&gt;
                      &lt;/div&gt;
                  &lt;/div&gt;
              }))
          }
          return (
              &lt;div className={"container"}&gt;
                  &lt;div className="row"&gt;
                      {album_list}
                  &lt;/div&gt;
              &lt;/div&gt;
          )
      }
  }
  </code></pre>
  
  <p>Here I have <code>onMouseEnter</code> on <code>album_list</code>. When it is hover or mouse enter I want to dispalay a button on that div.</p>
  
  <p>How can I do that ??</p>
  
  <p>Thank you</p>