Question

我有以下Chrome应用。当我运行它时，主窗口显示但鼠标滚轮不起作用。当我在chrome中打开main.html时，滚动工作正常。如何解决？

的manifest.json：

{
  "name": "Scroll not working",
  "version": "1.0",
  "manifest_version": 2,
  "description": "Scrolling in this chrome app is not working",
  "app": {
    "background": {
      "scripts": ["background.js"]
    }
  }
}

background.js：

// Background script (displays main window)
'use strict';
chrome.app.runtime.onLaunched.addListener(function () {
    chrome.app.window.create('main.html');
});

main.html中：

＆＃13;

<!DOCTYPE html>
<html>
  <head>
  </head>
  <body>
    <div style="border: 1px solid red; position: fixed;">this fixed element will break the scroll wheel but only when it is run as chrome app, on normal page it will work ok</div>
    <div>1</div>
    <div>2</div>
    <div>3</div>
    <div>4</div>
    <div>5</div>
    <div>6</div>
    <div>7</div>
    <div>8</div>
    <div>9</div>
    <div>10</div>
    <div>11</div>
    <div>12</div>
    <div>13</div>
    <div>14</div>
    <div>15</div>
    <div>16</div>
    <div>17</div>
    <div>18</div>
    <div>19</div>
    <div>20</div>
    <div>21</div>
    <div>22</div>
    <div>23</div>
    <div>24</div>
    <div>25</div>
    <div>26</div>
    <div>27</div>
    <div>28</div>
    <div>29</div>
    <div>30</div>
    <div>31</div>
    <div>32</div>
    <div>33</div>
    <div>34</div>
    <div>35</div>
    <div>36</div>
    <div>37</div>
    <div>38</div>
    <div>39</div>
    <div>40</div>
    <div>41</div>
    <div>42</div>
    <div>43</div>
    <div>44</div>
    <div>45</div>
    <div>46</div>
    <div>47</div>
    <div>48</div>
    <div>49</div>
    <div>50</div>
    <div>51</div>
    <div>52</div>
    <div>53</div>
    <div>54</div>
    <div>55</div>
    <div>56</div>
    <div>57</div>
    <div>58</div>
    <div>59</div>
    <div>60</div>
  </body>
</html>

＆＃13;

Answer 1

Chrome套装应用程序有一些默认的CSS应用程序。 Chrome打包应用通常不会滚动主体内容。将以下内容放入CSS应该重新启用滚动：

html, body {
    overflow-y:auto;
}

即使是单个固定元素

1 个答案: