4-11总结

1.网页如何做出向左移动的效果
使用margin-left,设置未负值。
举例父div宽高设置400px,300px,子div宽高设置1000px,300px
此时在宽度上。子div超过了父亲,把父div设置overflow:hidden;超出不可见。
然后设置子div的margin-left为负值,此时就有向左移动的效果。

可以设置按钮或者滑块记录margin-left的值来进行导航。
一般最小值是0.
最大值是1000px-400px=600px 剩下的举例和一屏的父宽度一致即可。

2.网页产生滚动条
   首先父元素需要设置 overflow: scroll,
   具体overflow-x,overflow-y:

   当自己长度或者高度超出父元素,父元素有设置超出滚动,则出现滚动条。
   .p::-webkit-scrollbar{display:none;}可以隐藏滚动条,
   然后通过按钮或者滑块设置scrollleft 或者scrolltop来达到滚动的效果。

3.jquery ui 拖拽的块怎么能不重叠
首先我的思路是按照x,y,flag这种模式进行初始化,判断,后来发现行不通。
复杂而且不可靠。
更好的思路:
1.start事件记录滑块开始的位置left,top,width,height
2.stop事件记录结束的位置left,top,width,height,
3.使用.bar 进行each循环找到这个类的每一个进行比较,left,top,width,height,
如果重叠,则使用start记录的数据把滑块送到开始的位置。

这个问题转化成一个更一般的问题,2个块,有left,top,width,height,
怎么判断这2个块是否有部分重叠?这个根网页没有关系,纯粹是逻辑的判断,
我一开始认为这根本不可能。事实上,是可以的。

这个涉及到计算机图形学2个矩形是否重叠的问题?
 var lh = Math.max(now.top + now.height - one.top, one.top + one.height - now.top);
 var lw = Math.max(now.left + now.width - one.left, one.left + one.width - now.left);
 if (lh < now.height + one.height && lw < now.width + one.width) {
    return true;
 }

4.Nlog日志
.net core 默认有日志从控制台输出,使用Nlog组件把控制台日志输出到文件。

Nuget下载:

NLog.Web.AspNetCore 4.8 
创建配置文件 nlog.config 设置属性:复制到输出目录,始终覆盖

 <?xml version="1.0" encoding="utf-8" ?>
<nlog xmlns="http://www.nlog-project.org/schemas/NLog.xsd"
      xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
      autoReload="true"
      throwConfigExceptions="true"
      internalLogLevel="info"
      internalLogFile="d:\log\internal-nlog.txt">

  <!-- the targets to write to -->
  <targets>
    <!-- write logs to file  -->
    <target xsi:type="File" name="allfile" fileName="d:\log\nlog-all-${shortdate}.log"
            layout="${longdate}|${event-properties:item=EventId_Id:whenEmpty=0}|${uppercase:${level}}|${logger}|${message} ${exception:format=tostring}" />

    <!-- another file log, only own logs. Uses some ASP.NET core renderers -->
    <target xsi:type="File" name="ownFile-web" fileName="d:\log\nlog-own-${shortdate}.log"
            layout="${longdate}|${event-properties:item=EventId_Id:whenEmpty=0}|${uppercase:${level}}|${logger}|${message} ${exception:format=tostring}|url: ${aspnet-request-url}|action: ${aspnet-mvc-action}|${callsite}" />
  </targets>

  <!-- rules to map from logger name to target -->
  <rules>
    <!--All logs, including from Microsoft-->
    <logger name="*" minlevel="Trace" writeTo="allfile" />

    <!--Skip non-critical Microsoft logs and so log only own logs-->
    <logger name="Microsoft.*" maxlevel="Info" final="true" />
    <!-- BlackHole -->
    <logger name="*" minlevel="Trace" writeTo="ownFile-web" />
  </rules>
</nlog>


启动调用日志组件。Program.cs 
public static IWebHost BuildWebHost(string[] args) =>
            WebHost.CreateDefaultBuilder(args)
                .UseStartup<Startup>()
                .UseNLog() //日志
                .Build();

其他版本配置文件:(简单)
<nlog xmlns="http://www.nlog-project.org/schemas/NLog.xsd" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance">
    <targets>
        <target name="console" xsi:type="Console" />
        <target name="debugger" xsi:type="Debugger" layout="${date:format=HH\:mm\:ss.fff}: ${message}" />
        <target name="error_file" xsi:type="File"
                        fileName="${basedir}/Logs/Error/${shortdate}/error.txt" maxArchiveFiles="30"
                        layout="${longdate} | ${level:uppercase=false} | ${message} ${onexception:${exception:format=tostring} ${newline} ${stacktrace} ${newline}" />
    </targets>
    <rules>
        <!--<logger name="*" writeTo="console" />-->
        <logger name="*" minlevel="Debug" writeTo="debugger" />
        <logger name="*" minlevel="Error" writeTo="error_file" />
    </rules>
</nlog>
 

猜你喜欢

转载自blog.csdn.net/MannMann/article/details/89205241