Jump to content
  • Sign in to follow this  

    Спойлер в IPS Community Suite 4


    Silence

    Спойлер в IPS Community Suite 4

    Перейти ACP - Customization -> Toolbars и нажмите на кнопку Add Button -> Custom:

    1.png

    Заполните поля:

    Button Title:  spoiler

    Icon:  загрузить изображение

    выбирать: Block

    Use option?: включить

    HTML:

    Спойлер
    <div><input type="checkbox" id="spoiler2" />
    <label for="spoiler2">Spoiler</label>
    <div class="spoiler">{option}</div>
    <style>
    input[id^="spoiler"] {
      display: none;
    }
    
    input[id^="spoiler"] + label {
      display: block;
      width: 200px;
      margin:  auto;
      padding: 5px 20px;
      background: #607D8B;
      color: #fff;
      text-align: center;
      font-size: 24px;
      border-radius: 2px;
      cursor: pointer;
      transition: all .6s;
    }
    
    input[id^="spoiler"]:checked + label {
      color: #333;
      background: #ccc;
    }
    
    input[id^="spoiler"] ~ .spoiler {
      width: 90%;
      height: ;
      overflow: hidden;
      opacity: ;
      margin: 10px auto ;
      padding: 10px;
      background: #eee;
      border: 1px solid #ccc;
      border-radius: 2px;
      transition: all .6s;
    }
    
    input[id^="spoiler"]:checked + label + .spoiler {
      height: auto;
      opacity: 1;
      padding: 10px;
    }
    </style></div>

     

    Сохранить

    4.png

    11.png

    12.png

    14.png

    Sign in to follow this  


    User Feedback

    Recommended Comments

    There are no comments to display.



    Create an account or sign in to comment

    You need to be a member in order to leave a comment

    Create an account

    Sign up for a new account in our community. It's easy!

    Register a new account

    Sign in

    Already have an account? Sign in here.

    Sign In Now

×