Question

我在智能手机浏览器上遇到了bootstrap模式的问题。它向下滚动，并且不会出现模态。

在调试浏览器（我使用Chrome浏览器）上，当我选择列表中的智能手机时，模式显示为corectly，但是当我使用该设备时，它无法正常工作。滚动。我已阅读有关此问题的有关stackoverflow的文章，但在我的情况下，它不起作用。

我制作了一个版画屏幕：在这种情况下，模态显示为corectly（在Chrome浏览器上）

以下代码的一部分：

<div id='myModal' class='modal fade' role="dialog">
<div class="modal-dialog">
    <div class="modal-content" style="padding-left:20px">
        <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                <span aria-hidden="true">&times;</span>
            </button>
            <h2>@Facultate.Message.headStudentCurs</h2>
        </div>
        <div id='myModalContent'></div>

    </div>
</div>

 $(function () {
    $.ajaxSetup({ cache: false });
    $("a[data-modal]").on("click", function (e) {
        $('#myModalContent').load(this.href, function () {
            $('#myModal').modal({
                keyboard: true
            }, 'show');
        });
        return false;
    });
});

和标题：

 <link href="~/Content/MyStyle.css" rel="stylesheet" />
<link href="~/Content/jquery.jqGrid/ui.jqgrid.css" rel="stylesheet" />
<link href="~/Content/themes/base/jquery-ui.css" rel="stylesheet" />
<script src="~/Scripts/jquery-1.11.0.min.js"></script>
<script language="JavaScript" type="text/javascript" src="~/Scripts/i18n/grid.locale-en.js"></script>
<script language="JavaScript" type="text/javascript" src="~/Scripts/jquery.jqGrid.src.js"></script>
<script src="~/Scripts/bootbox.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.1/js/select2.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.2/css/bootstrap.min.css" integrity="sha384-y3tfxAZXuh4HwSYylfB+J125MxIs6mR5FOHamPBG064zB+AFeWH94NdvaCBm8qnd" crossorigin="anonymous">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.1/css/select2.min.css" rel="stylesheet" />
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>






<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">

<title></title>
@Styles.Render("~/Content/css")
@Scripts.Render("~/bundles/modernizr")

我想记住，我使用的是最后一个bootstrap版本v3.3.7

Answer 1

我已经解决了这个问题。那就是问题：

import java.util.*;
public class bisectionSearch2
{
  public static void main(String[] args)
  {
    Scanner in = new Scanner(System.in);
    System.out.print("Please Enter A Number To Find Its Square Root : ");
    double number = in.nextDouble();
    int itr=0;
    double low =0.0,high=number;
    double guess=(high+low)/2.0;
    while (Math.pow(guess,2)-number!=0.0) 
    { 
      itr+=1;
      System.out.println(guess);
      if (Math.pow(guess,2.0)<number) 
      {
        low = guess;
      }
      if (Math.pow(guess,2.0)>number) 
      {
        high=guess;  
      }
      guess=(high+low)/2.0;
    }
    System.out.println("The Correct Square Root Of The Number "+number+" is "+guess);
    System.out.println("It Took "+itr+" Try/ies To Guess The Square Root of "+ number +" Using Bisection-Search !"); 
  }

我已从css文件中删除此代码，并且我已更改了引导程序版本。

Answer 2

来源：W3school

尝试这样：

＆＃13;

<!DOCTYPE html>
<html lang="en">
<head>
  <title>Bootstrap Example</title>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
</head>
<body>

<div class="container">
  <h2>Modal Example</h2>
  <!-- Trigger the modal with a button -->
  <button type="button" class="btn btn-info btn-lg" data-toggle="modal" data-target="#myModal">Open Modal</button>

  <!-- Modal -->
  <div class="modal fade" id="myModal" role="dialog">
    <div class="modal-dialog">
    
      <!-- Modal content-->
      <div class="modal-content">
        <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal">&times;</button>
          <h4 class="modal-title">Modal Header</h4>
        </div>
        <div class="modal-body">
          <p>Some text in the modal.</p>
        </div>
        <div class="modal-footer">
          <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
        </div>
      </div>
      
    </div>
  </div>
  
</div>

</body>
</html>

＆＃13;

Bootstrap Modal在智能手机设备上向下滚动

2 个答案: