показать мобильный сайт на десктопе.

Можно ли как то в пределах страницы подменить юзер агента и размер экрана?

Можно запускать страницу в iframe с заданными размерами, например:

<!DOCTYPE html>
<html>

  <head>
    <meta charset="utf-8">
    <script src="https://code.jquery.com/jquery-2.1.1.js"></script>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.css" />
  </head>

  <body>
    <div class="container">
      <style scoped>
        iframe[src] {
          border: 1px solid black;
        }
        .select-placeholder {
          display: none;
        }
        .row + .row {
          margin-top: 10px;
        }
      </style>
      <div class="row">
        <div class="col-md-12">
          <h1>Test various screen resolutions</h1>
          <hr>
          <form role="form">
            <select class="form-control" id="screen-size">
              <option default selected class="select-placeholder">Select screen size</option>
              <option data-width="1024" data-height="500">1024&times;400</option>
              <option data-width="500" data-height="500">500&times;400</option>
            </select>
          </form>
        </div>
      </div>

      <div class="row">
        <div class="col-md-12"><iframe id="child" frameborder="0"></iframe></div>
      </div>
    </div>

    <script>
      $(function () {
        var frame = window.frames['child'];

        $('#screen-size').change(function () {
          var option = $(this).find('option:selected');
          var width = option.data('width');
          var height = option.data('height');

          frame.width = width;
          frame.height = height;
          frame.src = 'iframe.html'
        });
      });
    </script>
  </body>

</html>

iframe.html:

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <script src="https://code.jquery.com/jquery-2.1.1.js"></script>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.css" />
  </head>
  <body>
    <div class="container">
      <div class="row">
        <div class="col-md-6">
          <div class="panel panel-default">
            <div class="panel-heading">Responsive panel #1</div>
            <div class="panel-body">
              Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enimad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
            </div>
          </div>
        </div>

        <div class="col-md-6">
          <div class="panel panel-default">
            <div class="panel-heading">Responsive panel #2</div>
            <div class="panel-body">
              Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enimad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
            </div>
          </div>
        </div>
      </div>
    </div>
  </body>
</html>

Юзерагент для iframe тоже можно подменить, но только после загрузки iframe.

theNamelessOne ★★★★★
(13.11.14 12:08:10 MSK)

Ответ на: комментарий от theNamelessOne 13.11.14 12:08:10 MSK

Если после загрузки в iframe, то может возникнуть гонка с яваскриптом который туда загрузился

OxiD ★★★★
(17.11.14 19:50:41 MSK) автор топика

Ссылка

Похожие темы