“帮助:沙盒”的版本间的差异

来自个人维基
跳转至： 导航、 搜索
（撤销版本99534）
（→‎Animated {{tl|Hidebox}}?： 新段落）
第6行： 第6行：
 
              ．    ．   ，       ，​“”！！（
 
              ．    ．   ，       ，​“”！！（
 
}}
 
}}
 +
 +
== Animated {{tl|Hidebox}}? ==
 +
 +
{{hidebox|hidebox|Lorem ipsum dolor sit amet}}
 +
 +
{{MywikiParaHack|<html><style>
 +
.lnnblog-hidebox {
 +
  overflow: hidden;
 +
}
 +
.lnnblog-hidebox-heading {
 +
  list-style: none;
 +
  position: relative;
 +
  padding-left: 1.2rem;
 +
}
 +
.lnnblog-hidebox-heading::-webkit-details-marker { display: none }
 +
.lnnblog-hidebox-heading::before {
 +
  content: '';
 +
  position: absolute;
 +
  top: 0;
 +
  bottom: 0;
 +
  left: 0.4rem;
 +
  margin: auto;
 +
  height: 0;
 +
  border: 0.3rem solid transparent;
 +
  border-left-width: 0.5rem;
 +
  border-left-color: currentColor;
 +
  transform: rotate(0);
 +
  transform-origin: 0.25rem 50%;
 +
  transition: 250ms transform;
 +
}
 +
.lnnblog-hidebox[open]:not([data-lnnblog-hidebox-state]) > .lnnblog-hidebox-heading::before,
 +
.lnnblog-hidebox[data-lnnblog-hidebox-state="expand"] > .lnnblog-hidebox-heading::before {
 +
  transform: rotate(90deg);
 +
}
 +
</style><script>
 +
var animationDuration = 250
 +
 +
$( "#bodyContent" ).on( "click", ".lnnblog-hidebox-heading", function ( event ) {
 +
  var $this = $( this )
 +
  var $parent = $this.parent()
 +
  var $body = $this.nextAll( ".lnnblog-hidebox-body" )
 +
 +
  var open = $parent.prop( "open" )
 +
  var state = $parent.attr( "data-lnnblog-hidebox-state" )
 +
 +
  if ( !open || state === "shrink" ) {
 +
    event.preventDefault()
 +
    var currentWidth = $parent.width()
 +
    var currentHeight = $parent.height()
 +
    $parent.stop( true, true ).prop( "open", true )
 +
    var targetWidth = $parent.width()
 +
    var targetHeight = $parent.height()
 +
 +
    $body.width( targetWidth )
 +
    $parent
 +
      .attr( "data-lnnblog-hidebox-state", "expand" )
 +
      .width( currentWidth )
 +
      .height( currentHeight )
 +
    $parent.animate( {
 +
        width: targetWidth,
 +
        height: targetHeight
 +
      }, {
 +
        duration: animationDuration,
 +
        done: function () {
 +
          $parent.css( {
 +
            width: "",
 +
            height: ""
 +
          } )
 +
          $body.css( "width", "" )
 +
        }
 +
      } )
 +
  } else if ( open || state === "expand" ) {
 +
    event.preventDefault()
 +
    var currentWidth = $parent.width()
 +
    var currentHeight = $parent.height()
 +
    $parent.stop( true, true ).prop( "open", false )
 +
    var targetWidth = $parent.width()
 +
    var targetHeight = $parent.height()
 +
 +
    state === "expand" || $body.width( currentWidth )
 +
    $parent
 +
      .attr( "data-lnnblog-hidebox-state", "shrink" )
 +
      .width( currentWidth )
 +
      .height( currentHeight )
 +
      .prop( "open", true )
 +
      .animate( {
 +
        width: targetWidth,
 +
        height: targetHeight
 +
      }, {
 +
        duration: animationDuration,
 +
        done: function () {
 +
          $body.css( "width", "" )
 +
          $parent
 +
            .css( {
 +
              width: "",
 +
              height: ""
 +
            } )
 +
            .prop( "open", false )
 +
        }
 +
      } )
 +
  }
 +
})
 +
</script></html>}}

2022年11月21日 (一) 23:06的版本

lnncrypt

              ．    ．   ，       ，​“”！！（

Animated {{Hidebox}}?

hidebox

Lorem ipsum dolor sit amet

来自“https://www.mywiki.cn/dgck81lnn/index.php?title=帮助:沙盒&oldid=99678”