[JAVA] [Rails] Implementation of image enlargement function using lightbox2

Target

ezgif.com-video-to-gif.gif

Development environment

・ Ruby: 2.5.7 Rails: 5.2.4 ・ Vagrant: 2.2.7 -VirtualBox: 6.1 ・ OS: macOS Catalina

Premise

The following has been implemented.

・ Slim introduction ・ Implementation of posting function

Implementation

1. Edit ʻapplication.html.slim`

slim:application.html.slim


doctype html
html
  head
    title
      | Bookers2
    = csrf_meta_tags
    = csp_meta_tag
    = stylesheet_link_tag    'application', media: 'all', 'data-turbolinks-track': 'reload'
    /Postscript
    link href='https://cdnjs.cloudflare.com/ajax/libs/lightbox2/2.7.1/css/lightbox.css' rel='stylesheet'
    = javascript_include_tag 'application', 'data-turbolinks-track': 'reload'
    /Postscript
    script src='https://cdnjs.cloudflare.com/ajax/libs/lightbox2/2.7.1/js/lightbox.min.js' type='text/javascript'

2. Edit ʻimage_tag`

slim:books/show.html.slim


= link_to @book.image.url, 'data-lightbox': @book.image do
  = image_tag @book.image.to_s

Recommended Posts

[Rails] Implementation of image enlargement function using lightbox2
[Rails] Implementation of image preview function
[Rails] Implementation of search function using gem's ransack
[Rails 6] Implementation of inquiry function using Action Mailer
[Rails] Implementation of image slide show using Bootstrap 3
[Rails 6] Implementation of search function
Implementation of image preview function
[Rails] Implementation of category function
[Rails] Implementation of tutorial function
[Rails] Implementation of like function
[Rails] Implementation of multi-layer category function using ancestry "Preparation"
[Rails] Implementation of multi-layer category function using ancestry "seed"
[Rails] Implementation of CSV import function
[Rails] Asynchronous implementation of like function
[Rails] About implementation of like function
[Rails] Implementation of user withdrawal function
[Rails] Implementation of CSV export function
[Rails] Implementation of multi-layer category function using ancestry "Editing form"
[Rails] Implementation of multi-layer category function using ancestry "Creation form"
[Rails] Implementation of tagging function using intermediate table (without Gem)
Implementation of user authentication function using devise (1)
Rails [For beginners] Implementation of comment function
[Rails 6] Implementation of SNS (Twitter) sharing function
Implementation of user authentication function using devise (3)
[Vue.js] Implementation of menu function Implementation version rails6
[Ruby on rails] Implementation of like function
[Vue.js] Implementation of menu function Vue.js introduction rails6
Multiple image upload function using Rails Carrierwave
[Rails] Implementation of new registration function in wizard format using devise
[Rails] Implementation of coupon function (with automatic deletion function using batch processing)
[Rails] Implementation of tag function using acts-as-taggable-on and tag input completion function using tag-it
Implementation of Ruby on Rails login function (Session)
Implementation of search function
[Rails] I will explain the implementation procedure of the follow function using form_with.
[Rails] Implementation of retweet function in SNS application
Image preview function implementation
[Rails] Implementation of batch processing using whenever (gem)
Rails search function implementation
Implementation of pagination function
[Rails] Implementation of PV number ranking using impressionist
[Note] Summary of rails login function using devise ①
[Rails] Set validation for the search function using Rakuten API (from the implementation of Rakuten API)
Ruby on Rails <2021> Implementation of simple login function (form_with)
[Rails] Implementation of drag and drop function (with effect)
[Rails] Test of star evaluation function using Raty [Rspec]
[Ruby on Rails] Implementation of tagging function/tag filtering function
[Rails] Implementation of SNS authentication (Twitter, Facebook, Google) function
Rails implementation of ajax removal
Rails fuzzy search function implementation
Search function using [rails] ransack
Implementation of sequential search function
Implementation of like function (Ajax)
Implementation of category pull-down function
Login function implementation with rails
Ajax bookmark function using Rails
[Rails] Implement image posting function
[Rails 6] Pagination function implementation (kaminari)
[Rails] Implementation of automatic address input using jpostal and jp_prefecture
Rails sorting function implementation (displayed in order of number of like)
[Rails] Implementation of user logic deletion
[Rails] Tag management function (using acts-as-taggable-on)