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

来自个人维基
跳转至： 导航、 搜索
（→‎Animated {{tl|Hidebox}}?）
第9行： 第9行：
 
== Animated {{tl|Hidebox}}? ==
 
== Animated {{tl|Hidebox}}? ==
  
−
{{hidebox|hidebox|Lorem, ipsum dolor sit amet consectetur adipisicing elit. Modi unde, ex rem voluptates autem aliquid veniam quis temporibus repudiandae illo, nostrum, pariatur quae! At animi modi dignissimos corrupti placeat voluptatum!
+
{{hidebox|hidebox|一二三四五，上山打老虎。}}
  
−
abixavxaubxibxsvuxvwuvuvduwvxuvduwvdduwyvxiebxownsoqnziwbxvuwzvywczyvzqinoqnziavzuavzyqvbzqiabzauyavxanxonceibxayvzunxownzibxuvwxuxboajxoanxiabxiwbxiwcbccnwoxbiwcbivneocncwoz
+
{{MywikiParaHack|<html><style>
−
}}
+
.lnnblog-hidebox {
 +
  max-width: 100%;
 +
}
 +
.lnnblog-hidebox[data-lnnblog-hidebox-state="expand"] {
 +
  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);
 +
}
 +
.lnnblog-hidebox-body {
 +
  overflow-wrap: break-word;
 +
}
 +
</style><script>
 +
var animationDuration = 250
 +
 
 +
$( ".lnnblog-hidebox-heading" ).on( "click", 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" + 1 )
 +
    var targetWidth = $parent.width()
 +
    var targetHeight = $parent.height()
 +
 
 +
    $body.outerWidth( targetWidth, true )
 +
    $parent
 +
      .attr( "data-lnnblog-hidebox-state", "expand" )
 +
      .width( currentWidth )
 +
      .height( currentHeight )
 +
    $parent.animate( {
 +
        width: targetWidth,
 +
        height: targetHeight
 +
      }, {
 +
        duration: animationDuration,
 +
        done: function () {
 +
          $body.css( "width", "" )
 +
          $parent
 +
            .css( {
 +
              width: "",
 +
              height: ""
 +
            } )
 +
            .removeAttr( "data-lnnblog-hidebox-state" )
 +
        }
 +
      } )
 +
  } 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.outerWidth( currentWidth + 1 )
 +
    $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 )
 +
            .removeAttr( "data-lnnblog-hidebox-state" )
 +
        }
 +
      } )
 +
  }
 +
  return false
 +
})
 +
</script></html>}}

2022年11月22日 (二) 11:16的版本

lnncrypt

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

Animated {{Hidebox}}?

hidebox

一二三四五，上山打老虎。

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